typescript - 如何让 vscode 执行与 ng serve 相同的构建？

我刚开始使用 angular-cli 和 vscode 开始我的第一个项目，一切都很顺利。我可以运行 ng server -o，然后我的网页应用程序就会弹出来！然而，有时我知道我将会进行很多破坏性更改，所以我不想让它一直运行，我希望在 vscode 里面做一个构建，这个构建完全模拟 ng 所做的构建。我明白我需要在 tasks.json 文件中创建一个构建任务，但我不知道驱动 ng 设置的是什么，以便我可以完全模拟那个构建。谢谢！

答案＃1

你的 package.json 应该有以下部分

    "scripts": {
    "ng": "ng",
    "start": "ng serve --delete-output-path=false",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"}

这些是你想要使用的 ng 脚本。要从 VS Code 任务中调用它们，只需编辑你的 tasks.json 来包含

{
    "taskName": "serve",
    "command": "npm start",
    "type": "shell",
    "problemMatcher": "$tsc"
},
{
    "taskName": "open -- -o",
    "command": "npm start",
    "type": "shell",
    "problemMatcher": "$tsc"
},
{
    "taskName": "lint",
    "command": "npm run lint",
    "type": "shell",
    "problemMatcher": "$tsc"
},
{
    "taskName": "e2e",
    "command": "npm run e2e",
    "type": "shell",
    "problemMatcher": "$tsc"
}

此外，要调试 Angular，您可以将以下内容添加到 launch.json

{ "name": "npm start",
  "type": "chrome",
  "request": "launch",
  "url": "http://localhost:4200/#",
  "webRoot": "${workspaceRoot}"
},
{
  "name": "ng test",
  "type": "chrome",
  "request": "launch",
  "url": "http://localhost:9876/debug.html",
  "webRoot": "${workspaceRoot}"
},
{
  "name": "ng e2e",
  "type": "node",
  "request": "launch",
  "program": "${workspaceRoot}/node_modules/protractor/bin/protractor",
  "protocol": "inspector",
  "args": ["${workspaceRoot}/protractor.conf.js"]
}