angular-cli,angular入门
什么是Angular cli？本文带你了解Angular中的Angular cli，并介绍Angular cli的用法。希望对你有帮助！
1. 什么是Angular cli
这是一个命令行界面工具，可用于初始化、开发、构建和维护Angular应用程序。【相关教程推荐：《angular教程》】
2. 如何安装
NPM安装-g @ angular/CLI，卸载时也需要带上-g。
Mn uninstall-g @ angular/CLI
3. 如何使用
3.1 创建项目(new n)
ng new my-project它将创建一个angular基本项目，并下载依赖的运行项目。默认端口是4200。
可能需要的定制内容
用法如下：
Ng my-project-XXX=x参数含义`- force=true false ` `- routing=true false ` `- skip install=true false ` `- skip tests=true false ` ` ` `- force=true false ` ` ` ` ` `。-style=csssscss `- package manager=npmyarn-prefix=prefix指定选择器的前缀(组件，指令)。如果传入- prefix=dep，组件的选择器将变成dep-xxx。
3.2 新建文件(generate g)
使用预设代码片段创建新的基本文件。如ng生成服务demo，在当前文件夹下会新建一个demo.service.ts。
命令缩写ng生成模块xx新模块ng g m xxng生成组件xx新组件ng g c xxng生成指令xx新命令ng g d xxng生成服务xx新服务ng g s xxng生成管道xx新管道ng g p xx有一个更简单的方法：
从vscode下载Angular Files插件，搜索alexiv.vscode-angular2-files即可找到。在任何你想要的地方创建点。用起来感觉很好。后面我会写一个用vscode开发angular的插件~
3.3 运行项目(serve s)
配置含义- host=xx设置应用的主机地址，别人可以根据这个地址访问你启动的应用。Xx可以是你的ip也可以是0.0.0.0-open=true false True，启动项目后页面会自动打开。缩写：ng server -o - port设置启动的端口号，避免启动占用同一个端口而无法启动的多个项目-proxy config=xx设置代理文件-watch=true false代码发生变化时是否自动重建刷新页面，默认为true-AOT=true false是否以预编译模式启动项目，默认为false。
缺点：项目运行时间增加。
优点：有时候开发过程中没有问题。如果打包上线后出现问题，可以在本地打开调试错误。
3.4 打包项目（build b）
配置含义-base href=x index . html其他静态资源文件的相对路径。也可以在index.html的baseHref=xx 或者angular.json的baseHref中配置。-AOT=true false是否以预编译模式启动项目，默认为false，一般在angular.json中配置- optimization=truefalse false是否启用构建输出的优化。- configuration=xx指定打包环境的配置-prod=true false-configuration=production的简称。True在生产环境中打包，并执行树摇动优化等操作。--configuration详解当我需要制作不同的环境包时，我可以使用以下方法：
以下配置是在angular.json中进行的：
{
项目：{
项目名称：{
建筑师：{
构建：{
配置：{
生产：{
fileReplacements: [
{
替换: src/environments/environment . ts ，
with : src/environments/environment . prod . ts
}
],
.
},
问答：{
fileReplacements: [
{
替换: src/environments/environment . ts ，
src/environments/environment . QA . ts
}
],
.
},
坐：{
fileReplacements: [
{
替换: src/environments/environment . ts ，
src/environments/environment . sit . ts
}
],
.
}
},
}
}
}
}
}之后，您可以打包不同的环境：
QA:ng build-c=QA sit:ng build-c=sit prod:ng build-c=production
3.5 更新项目（update ）
从一个主要版本升级到另一个主要版本。升级前最好先看官方升级指南。
Ng更新@ angular/CLI @ major _ version @ angular/core @ major _ version先看看有什么可以更新的。Ngupdate可以单独更新，也可以选择全部更新。Ngupdate-all。如果在更新过程中提示您某些依赖包的版本不一致，您可以强制更新包“@ angular/compiler-CLI”与“typescript”的对等依赖不兼容(要求“=2.7.2 2.8”，应安装“2.5.3”)。
找到了可比较的对等依赖关系。见上文。强制更新方法：
ng更新-全部队如何修改update默认下载工具为yarn
ng config-global CLI . package manager yarn ng set-global package manager=yarn
3.6 其他
ng lint:运行代码规则检测ng test:运行单元测试ng e2e:运行端到端测试ng add:将第三方库添加到项目中，其自定义配置也添加到项目中。如何编写一个可以用ng add添加的自定义配置的第三方包？有关编程的更多信息，请访问：编程视频！上面的Angular cli是什么？怎么用？更多详情请关注我们的其他相关文章！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。