1、使用VScode打开文件夹

VScode导入Vue项目

2、找到运行按钮

VScode导入Vue项目

3、判断有没有默认的配置文件存在

VScode导入Vue项目

4、若文件夹存在就检查配置文件是否存在

VScode导入Vue项目

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",      
            "request": "launch",
            "name": "Launch Program",
            // "console": "none",                 // 只输出到“调试控制台”      
            // "console": "externalTerminal",     // 外部终端调试器
            "console": "integratedTerminal",      // 内部终端调试器,同时输出到“调试控制台”和内置“终端”
            // "console": "internalConsole",      // 新版本VScode的选项,仅出输出到“调试控制台”
            "skipFiles": [
              "<node_internals>/**"
            ],
            "program": "${workspaceFolder}/node_modules/webpack-dev-server/bin/webpack-dev-server.js",
            "args": [
              "--inline",
              "--progress",
              "--config",
              "build/webpack.dev.conf.js"
            ]
        },
        {
            "name": "Launch Chrome",
            "request": "launch",
            "type": "pwa-chrome",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}"
        },
    ]
}

VScode导入Vue项目

(2)运行项目

VScode导入Vue项目

(3)停止/关闭项目

VScode导入Vue项目

5、若文件夹不存在

(1)点击创建launch.json文件

VScode导入Vue项目

(2)创建时会自动生成.vscode文件夹和launch.json文件

VScode导入Vue项目

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",      
            "request": "launch",
            "name": "Launch Program",
            // "console": "none",                 // 只输出到“调试控制台”      
            // "console": "externalTerminal",     // 外部终端调试器
            "console": "integratedTerminal",      // 内部终端调试器,同时输出到“调试控制台”和内置“终端”
            // "console": "internalConsole",      // 新版本VScode的选项,仅出输出到“调试控制台”
            "skipFiles": [
              "<node_internals>/**"
            ],
            "program": "${workspaceFolder}/node_modules/webpack-dev-server/bin/webpack-dev-server.js",
            "args": [
              "--inline",
              "--progress",
              "--config",
              "build/webpack.dev.conf.js"
            ]
        },
        {
            "name": "Launch Chrome",
            "request": "launch",
            "type": "pwa-chrome",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}"
        },
    ]
}

VScode导入Vue项目

(4)运行项目

VScode导入Vue项目

(5)停止/关闭项目

VScode导入Vue项目

相关文章:

  • 2021-09-30
  • 2021-12-11
  • 2021-10-09
  • 2021-05-23
  • 2021-04-29
  • 2021-09-17
猜你喜欢
  • 2022-12-23
  • 2021-06-30
  • 2021-10-23
  • 2021-11-21
相关资源
相似解决方案