본문 바로가기

프로그래밍

[Flutter / 플러터] 플러터 VSCode에서 디버깅 / 실행하기 (Flutter VSCode launch.json)

플러터 강의를 보며 VSCode에서 실행하는 방법을 보고 따라하려하는데 VSCode가 달라지면서 UI도 바뀌어서 방법이 달랐다. 그래서 하는김에 아예 디버깅 실행 방법을 정하는 걸로 추정되는 launch.json 파일을 플러터에 맞게 수정했다. 

 

일단 프로젝트 폴더내에서 '.vscode' 폴더에 등어가서 launch.json'를 찾아서 vscode에서 연다. 

그리고 오른쪽 패널에서는 디버깅 패널을 열어준다. 

그리고 나서 json파일에 confiqurations 안에는 아래 내용을 넣어준다. 

 

	{
            "name": "Current Device",
            "request": "launch",
            "type": "dart"
        },
        {
            "name": "Current Device (profile mode)",
            "request": "launch",
            "type": "dart",
            "flutterMode": "profile"
        },
        {
            "name": "Current Device (release mode)",
            "request": "launch",
            "type": "dart",
            "flutterMode": "release"
        },
        {
            "name": "Android 9 (API 28) (Pixel 2)",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "emulator-5554"]
        },
        {
            "name": "Android 12 (API 31) (Pixel 4)",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "emulator-5556"]
        },
        {
            "name": "Windows",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "windows"]
        },
        {
            "name": "Web",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "chrome"]
        },
        {
            "name": "Android Device",
            "request": "launch",
            "type": "dart",
            "deviceId": "android"
        },
        {
            "name": "iPhone Device",
            "request": "launch",
            "type": "dart",
            "deviceId": "iphone"
        }

참고로 'Android  9 ~~~'와 'Android 12 ~~~' 두가지는 내 컴퓨터의 안드로이드 스튜디오 에뮬레이터에 있는 에뮬레이터 ID를 가지고 온 것으로, 해당 명령어들은 삭제하거나, 본인에 맞춰 수정해야 한다. 

 

그리고, Flutter를 한다면 다 깔려는 있겠지만, Web은 크롬이 깔려있어야 실행되고, Windows는 윈도우에서만 실행되며, iphone 실행은 맥에서만 실행된다. (윈도우 유저라 아이폰은 테스트 하지 못했다)

 

추가로 하단 "compounds" 안에는 아래 내용을 넣어주어도 되는데, 이곳에는 위에 적은 디버깅 명령어들을 동시에 여러개 실행시킬 수 있다. 

 

	{
            "name": "All Devices",
            "configurations": ["Android", "iPhone", "Web", "Windows"]
        }

 

그리고! 혹시 이 파일이 없는 경우 디버깅 패널에 아마 launch.json 만드는 옵션이 있었던걸로 기억하는데, 그것도 안될 경우 아래 내용을 붙여넣기 해봐도 좋을 거 같다 (아래 내용은 현재 내 launch.json)

{
    // IntelliSense를 사용하여 가능한 특성에 대해 알아보세요.
    // 기존 특성에 대한 설명을 보려면 가리킵니다.
    // 자세한 내용을 보려면 https://go.microsoft.com/fwlink/?linkid=830387을(를) 방문하세요.
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Current Device",
            "request": "launch",
            "type": "dart"
        },
        {
            "name": "Current Device (profile mode)",
            "request": "launch",
            "type": "dart",
            "flutterMode": "profile"
        },
        {
            "name": "Current Device (release mode)",
            "request": "launch",
            "type": "dart",
            "flutterMode": "release"
        },
        {
            "name": "Android 9 (API 28) (Pixel 2)",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "emulator-5554"]
        },
        {
            "name": "Android 12 (API 31) (Pixel 4)",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "emulator-5556"]
        },
        {
            "name": "Windows",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "windows"]
        },
        {
            "name": "Web",
            "request": "launch",
            "type": "dart",
            "args" : ["-d", "chrome"]
        },
        {
            "name": "Android Device",
            "request": "launch",
            "type": "dart",
            "deviceId": "android"
        },
        {
            "name": "iPhone Device",
            "request": "launch",
            "type": "dart",
            "deviceId": "iphone"
        }
            
        
    ],
    "compounds": [
        {
            "name": "All Devices",
            "configurations": ["Android", "iPhone", "Web", "Windows"]
        }
    ]
}

 

 

감사합니다!!

반응형