如何让vscode与ng服务器执行相同的构建？

问题描述：

我刚刚开始使用angular-cli和vscode创建我的第一个项目，并且所有内容都是膨胀的。我可以运行ng服务器-o并弹出我的web应用程序！然而，有时候我知道我会做很多重大更改，所以我不希望它一直运行，我想在vscode中构建一个完全模仿ng将会执行的构建。我知道我必须在tasks.json文件中创建一个构建任务，但我不知道是什么驱动ng的设置，所以我可以完全模仿这个构建。谢谢！如何让vscode与ng服务器执行相同的构建？

这是有用的，因为那时候我只编译我的代码。 [忽略node_modules文件夹]（http://stackoverflow.com/questions/30313805/how-to-ignore-node-modules-folder-during-typescript-build-in-vscode）但仍然有很多ts选项（http://www.typescriptlang.org/docs/handbook/tsconfig-json.html） – John

答

你的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脚本。要只需编辑您的tasks.json VS代码任务打电话给他们，包括

{ 
    "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" 
}

此外调试角度，你可以添加以下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"] 
}

如何让vscode与ng服务器执行相同的构建？

相关推荐