如何讓vscode與ng服務器執行相同的構建？

我剛剛開始使用angular-cli和vscode創建我的第一個項目，並且所有內容都是膨脹的。我可以運行ng服務器-o並彈出我的web應用程序！然而，有時候我知道我會做很多重大更改，所以我不希望它一直運行，我想在vscode中構建一個完全模仿ng將會執行的構建。我知道我必須在tasks.json文件中創建一個構建任務，但我不知道是什麼驅動ng的設置，所以我可以完全模仿這個構建。謝謝！如何讓vscode與ng服務器執行相同的構建？

來源

2017-05-10 John

這是有用的，因爲那時候我只編譯我的代碼。 [忽略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"] 
}

來源

2017-10-02 22:52:00

如何讓vscode與ng服務器執行相同的構建？

回答

相關問題