什麼是Angular cli？這篇文章帶大家了解一下Angular中的Angular cli，介紹一下Angular cli的使用方法，希望對大家有幫助！
它是一個命令列介面工具，可用來初始化、開發、建置和維護Angular 應用。 【相關教學推薦：《angular教學》】
無npm先去下載nodejs
#https://nodejs.org/en/download/
npm install -g @angular/cli
卸載的話也需要帶上-g
npm uninstall -g @angular/cli
new|n指n是new的縮寫，效果相同，下式相同。
ng new my-project
它會建立一個angular基礎項目並且下載依賴運行項目，預設連接埠是4200。
可能需要用到的自訂內容
用法形如：
ng new my-project --xxx=x
以下不特殊註明預設值均為false
| 參數 | 意義 |
|---|---|
| #`--force=true | # false` |
| `--routing=true | false` |
| `--skipInstall=true | #false` |
| `--skipTests=true | #false` |
| `--force=true | false` |
| `--style=css | #scss |
| `--packageManager=npm | yarn |
--prefix=prefix | 指定選擇器的前綴（元件、指令），如傳入--prefix=dep則元件的selector會成為dep-xxx， |
##自定義，怎麼補救呢？直接在angular.json
改~
ng generate service demo，則會在目前資料夾新建一個demo.service.ts。
| 作用 | 簡寫 | |
|---|---|---|
| 新模組 | ng g m xx | |
| 新元件 | ng g c xx | |
| #新指令 | ng g d xx | ##ng generate service xx |
| ng g s xx | #ng generate pipe xx | |
| #ng g p xx |
alexiv.vscode-angular2-files
即可找到。想在哪裡創建點哪裡。用起來爽歪歪。後面會寫一個vscode開發angular好用的外掛~3.3 運行專案(
xx可以是你的ip或0.0.0.0 | |
| |
| |
#true則在啟動專案後自動開啟頁面，簡寫： ng server -o | |
--port | |
|
| 配置 | 意义 |
|---|---|
--baseHref=xx | index.html访问其他静态资源文件的相对路径。也可以在index.html的<base href="xx">中配置，还可以在.angular.json中的baseHref配置。 |
--aot=true|false | 是否以预编译模式启动项目， 默认false,一般在angular.json中配置 |
--optimization=true|false | 是否启用构建输出的优化。 |
--configuration=xx | 指定打包环境的配置 |
--prod=true|false | --configuration=production的简写。true则以生产环境的方式打包，进行摇树优化等操作。 |
当我需要打成不同的环境包时，可以使用以下方法：
在angular.json中做了如下配置，：
{
projects： {
project-name: {
architect: {
build: {
configurations: {
production: {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
...
},
qa: {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.qa.ts"
}
],
...
},
sit: {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.sit.ts"
}
],
...
}
},
}
}
}
}
}之后可以进行不同的环境打包：
ng build --c=qang build --c=sitng build --c=production--c 是 --configuration的缩写
angular半年更新一个大版本，及时更新版本是非常重要的事情，如果落后高于1个版本以上，后续可能升级会很麻烦（别问我怎么知道，再问跳楼）。
从一个主版本升级到另外一个主版本，升级之前最好看下官方的升级指南
ng update @angular/cli@^<major_version> @angular/core@^<major_version>
ng update
ng update --all
Package "@angular/compiler-cli" has an incompatible peer dependency to "typescript" (requires ">=2.7.2 <2.8", would install "2.5.3") Incompatible peer dependencies found. See above.
强制更新办法:
ng update --all --force
如何修改update默认下载工具为yarn
ng config --global cli.packageManager yarn
ng set --global packageManager=yarn
ng lint: 运行代码规则检测ng test: 运行单元测试ng e2e： 运行端到端测试ng add: 添加一个第三方库到项目中，并且将其自定义配置也添加到项目中。如何写一个可以用ng add添加的自定义配置的第三方包？
更多用法更新于 github
https://github.com/deepthan/blog-angular
更多编程相关知识，请访问：编程视频！！
以上是什麼是Angular cli？怎麼使用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
