1.安裝node.js
下載node.js從在網址:https://nodejs.org, 我用的版本是v10.16.3.
進入: https://nodejs.org/dist/ 可以找到所有的版本。
2. npm作爲默認隨node.js安裝
3.安裝指定版本的Angular cli
>npm i -g @angular/[email protected] 或
>npm install -g @angular/[email protected]
a. 卸載當前的angula cli, 並清除緩存
>npm install -g @angular/cli
>npm cache clean
4.可以創建angular項目了:
a.>ng new blueprj
a.1>cd blueprj
b.>ng g component admtech
c.>ng g service CartService
d>ng serve --open
The ng serve
command launches the server, watches your files, and rebuilds the app as you make changes to those files.
The --open
(or just -o
) option automatically opens your browser to http://localhost:4200/
.
5.安裝bootstrap的幾個命令
在工程目錄下執行, bootstrap的包被安裝的blueprj\node_modules下
\blueprj>npm i [email protected] -s
>npm i bootstrap --save
>npm i @types/bootstrap --save-dev
Angular6的命令行工具配置文件從angular-cli.json更名爲angular.json,且路徑變更
在.angular-cli.json文件中的apps下的styles和scripts裏分別寫入:
"../node_modules/[email protected]@bootstrap/dist/css/bootstrap.min.css",
"../node_modules/[email protected]@jquery/dist/jquery.js",
"../node_modules/[email protected]@bootstrap/dist/js/bootstrap.min.js"
// 調整前
"styles":[
"styles.css",
"../node_modules/bootstrap/dist/css/bootstrap.css"
],
"scripts":[
"../node_modules/jquery/dist/jquery.js",
"../node_modules/bootstrap/dist/js/bootstrap.js"
]
// 調整後
"styles":[
"src/styles.css",
"node_modules/bootstrap/dist/css/bootstrap.css"
],
"scripts":[
"node_modules/jquery/dist/jquery.js",
"node_modules/bootstrap/dist/js/bootstrap.js"
]
6. 引入指定版本的jquery
>npm i [email protected] -- save>
>npm i @types/jquery --save-dev
7. 當下載的anguar工程只包含src時, 可以用在工程根目錄下用以下命令安裝所有需要的包:
angular6login>npm install
安裝後, 需要的包被放在 node_modules目錄下: