vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令

第一种方法:

1.终端–>运行任务

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第1张图片

2.选择 npm:serve

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第2张图片

3.成功之后

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第3张图片

第二种方法:

1. 点击 调试,选择添加配置

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第4张图片
注:报错如下时,需在vscode内部再安装一遍node
这里写图片描述

2.选择环境Node.js

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第5张图片

3.编辑文件launch.json,替换为一下内容
{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "项目启动",
            "program": "${workspaceFolder}/build/dev-server.js"
        },
        {
            "type": "node",
            "request": "launch",
            "name": "项目build",
            "program": "${workspaceFolder}/build/build.js"
        }
    ]
}
4.运行调试,快捷键F5(默认运行为首个配置,可选择不同配置)

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第6张图片

5.运行成功示例如下:

vue-cli脚手架项目通过VS Code直接运行及build,无需敲打命令_第7张图片

你可能感兴趣的:(vue)