一 Angular CLI 是啥
Angular CLI 是一个命令行接口(Angular Command Line Interface),用于实现自动化开发工作流程。能让开发者更容易搭建和运行Angular工程。
Angular CLI 是Angular开发的一个辅助工具。
二 Angular CLI 安装
安装Angular CLI之前,先得安装Node.js和NPM。
Angular需要Node.js的8.x或10.x版本。一般安装Node.js之后npm也顺带给安装上了。我们可以通过node -v 命令和 npm -v 命令来查看node.js或者npm是否安装。
在安装了Node.js和npm之后,咱们就可以用如下命令来安装Angular CLI
# window平台上使用如下命令
npm install -g @angular/cli
# mac或者linux平台上使用如下命令
sudo npm install -g angular-cli
之后可以通过 ng version 命令来验证Angular CLI是否成功安装。
三 Angular CLI 命令
3.1 ng new
ng new <name> [options]
ng n <name> [options]
ng new命令用于创建一个新的Angular项目。
ng new 会创建目录并且创建Angular项目。
选项 说明 –collection=collection 别名:-c。用于生成初始应用程序的外部库,比如ng-zorro-antd –commit=true|false 默认值:true。初始git存储库提交信息 –createApplication=true|false 默认值:true。如果为true,则在新工作空间的src文件夹中创建一个新的初始应用程序项目。如果为false,则创建一个没有初始应用程序的空工作区。然后,您可以使用ng generate application命令,以便在projects文件夹中创建所有应用程序 –defaults=true|false 如果为true。则禁用具有默认选项的交互式输入提示 –directory=directory 用于创建工作空间的目录名称 –dryRun=true|false 默认值:false,别名:-d。如果为true,则运行并报告活动而不写出结果 –experimentalIvy=true|false 默认值:false。如果为true,则创建一个使用Ivy渲染引擎的新应用程序 –force=true|false 默认值:false,别名:-f。是否覆盖现有文件 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –inlineStyle=true|false 默认值:false,别名:-s。如果为true,则在组件TS文件中包含内联样式。默认情况下,在组件TS文件中创建并引用外部样式文件 –inlineTemplate=true|false 默认值:false,别名:-t。如果为true,则在组件TS文件中包含模板内联。默认情况下,在组件TS文件中创建并引用外部模板文件 –interactive=true|false 如果为false。则禁用交互式输入提示 –minimal=true|false 默认值:false。如果为true,则创建一个没有任何测试框架的项目 –newProjectRoot=newProjectRoot 默认值:projects。相对于新工作区根目录,将创建新项目的路径 –prefix=prefix 默认值:app,别名:-p。要应用于初始项目的生成选择器的前缀 –routing=true|false 默认值:false。如果为true,则为初始项目生成路由模块 –skipGit=true|false 默认值:false,别名:-g。如果为true,则不初始化git存储库 –skipInstall=true|false 默认值:false。如果为true,则不安装依赖包 –skipTests=true|false 默认值:false,别名:-S。如果为true,则不会为新项目生成“spec.ts”测试文件 –style=css|scss|sass|less|styl 默认值:css。用于样式文件的文件扩展名或预处理器 –verbose=true|false 默认值:false,别名:-v。如果为true,则向输出日志记录添加更多详细信息 –viewEncapsulation=Emulated|Native|None|ShadowDom 在初始项目中使用的视图封装策略
3.2 ng add
ng add <collection> [options]
为项目添加对外部库的支持。比如 ng add ng-zorro-antd 命令添加ng-zorro-antd ui框架。
选项 说明 –defaults=true|false 如果为true。则禁用具有默认选项的交互式输入提示 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –interactive=true|false 如果为false。则禁用交互式输入提示
3.3 ng generate
ng generate <schematic> [options]
ng g <schematic> [options]
根据schematic的设置生成或修改对应的文件。
选项 说明 –defaults=true|false 如果为true,则禁用具有默认选项的交互式输入提示 –dryRun=true|false 默认值:false,别名:-d。如果为true,则运行并报告活动而不写出结果 –force=true|false 默认值:false,别名:-f。如果为true,则强制覆盖现有文件 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –interactive=true|false 如果为false,则禁用交互式输入提示
ng generate可以生成或者修改多种类型的文件,通过schematic来指定生成或者修改的文件类型。schematic可以设置的类型有:appShell、application、class、component、directive、enum、guard、interface、library、module、pipe、service、serviceWorker、universal。
3.3.1 appShell
ng generate appShell [options]
ng g appShell [options]
生成用于运行应用程序的服务器端版本的应用程序shell。
选项 说明 –appDir=appDir 默认值:app。应用程序目录的名称 –appId=appId 默认值:serverApp。要在withServerTransition()中使用的应用程序ID –clientProject=clientProject 相关客户端应用程序的名称 –index=index 默认值:index.html。index文件的名字 –main=main 默认值:main.server.ts。主入口点文件的名称 –name=name 通用应用程序的HTML选择器 –outDir=outDir 默认值:dist-server。构建结果的输出目录 –root=root 默认值:src。应用程序的根目录 –rootModuleClassName=rootModuleClassName 默认值:AppServerModule。根模块类的名称 –rootModuleFileName=rootModuleFileName 默认值:app.server.module.ts。根模块文件的名称 –route=route 默认值:shell。用于生成app shell的路径路径 –sourceDir=sourceDir 默认值:src,别名:-D。源目录的路径 –test=test 测试入口点文件的名称 –testTsconfigFileName=testTsconfigFileName 默认值:tsconfig.spec。测试的TypeScript配置文件的名称 –tsconfigFileName=tsconfigFileName 默认值:tsconfig.server。TypeScript配置文件的名称 –universalProject=universalProject 相关通用应用程序的名称
3.3.2 application
ng generate application <name> [options]
ng g application <name> [options]
在当前工作区的“projects”文件夹下生成一个新的Angular应用。
选项 说明 –experimentalIvy=true|false 默认值: false。如果为True,则创建一个使用Ivy渲染引擎的新应用 –inlineStyle=true|false 默认值:false,别名:-s。 如果为true,则在根component.ts文件中包含内联样式。只能嵌入CSS样式。默认值为false,表示在根component.ts文件中创建并引用外部样式文件 –inlineTemplate=true|false 默认值:false,别名:-t。如果为true,则在根component.ts文件中包含内联模板。默认值为false,表示在根component.ts文件中创建并引用外部模板文件 –lintFix=true|false 默认值:false。如果为true,则在生成应用程序后应用lint修复 –minimal=true|false 默认值: false。如果为true,则创建一个没有任何测试框架的简单项目 –prefix=prefix 默认值: app,别名: -p。应用于生成的选择器的前缀 –routing=true|false 默认值:false。如果为true,则创建路由NgModule –skipInstall=true|false 默认值:false。跳过安装依赖包 –skipPackageJson=true|false 默认值: false。如果为true,则不会向“package.json”文件添加依赖项 –skipTests=true|false 默认值: false,别名: -S。如果为true,则不会为应用程序创建“spec.ts”测试文件 –style=css|scss|sass|less|styl 默认值: css。用于样式文件的文件扩展名或预处理器 –viewEncapsulation=Emulated|Native|None|ShadowDom 要在新应用中使用的视图封装策略
3.3.3 class
ng generate class <name> [options]
ng g class <name> [options]
在给定或默认项目中创建类。
选项 说明 –lintFix=true|false 默认值:false。如果为true,则在生成类后应用lint修复 –project=project 项目名称 –skipTests=true|false 默认值:false。如果为true,则不会为新类创建“spec.ts”测试文件 –type=type 将开发人员定义的类型添加到文件名中,格式为“name.type.ts”
3.3.4 component
ng generate component <name> [options]
ng g component <name> [options]
在给定或默认项目中创建组件。
选项 说明 –changeDetection=Default|OnPush 默认值:Default,别名:-c。要在新组件中使用的更改检测策略 –entryComponent=true|false 默认值:false。如果为true,则新组件是声明NgModule的入口组件 –export=true|false 默认值:false。如果为true,则声明NgModule导出此组件 –flat=true|false 默认值:false。如果为true,则在当前项目的顶级创建新文件 –inlineStyle=true|false 默认值:false,别名:-s。如果为true,则在component.ts文件中包含内联样式。只能嵌入CSS样式。默认情况下,在component.ts文件中创建并引用外部样式文件 –inlineTemplate=true|false 默认值:false,别名:-t。如果为true,则在component.ts文件中包含内联模板。默认情况下,会在component.ts文件中创建并引用外部模板文件 –lintFix=true|false 默认值:false。如果为true,则在生成组件后应用lint修复 –module=module 别名:-m。声明NgModule –prefix=prefix 别名:-p。要应用于生成的组件选择器的前缀 –project=project 项目名称 –selector=selector 用于此组件的HTML选择器 –skipImport=true|false 默认值:false。如果为true,则不会将此组件导入到拥有的NgModule中 –skipTests=true|false 默认值:false。如果为true,则不会为新组件创建“spec.ts”测试文件 –style=css|scss|sass|less|styl 默认值:css.用于样式文件的文件扩展名或预处理器 –viewEncapsulation=Emulated|Native|None|ShadowDom 别名:-v.要在新组件中使用的视图封装策略
3.3.5 directive
ng generate directive <name> [options]
ng g directive <name> [options]
在给定或默认项目中创建新的通用指令。
选项 说明 –export=true|false 默认值:false。如果为true,则声明NgModule会导出此指令 –flat=true|false 默认值:true。如果为true,则在当前项目的顶级创建新文件 –lintFix=true|false 默认值:false.如果为true,则在生成指令后应用lint修复 –module=module 别名:-m.声明NgModule –prefix=prefix 别名:-p.要应用于生成的选择器的前缀 –project=project 项目名称 –selector=selector 用于此指令的HTML选择器 –skipImport=true|false 默认值:false。如果为true,则不会将此指令导入到拥有的NgModule中 –skipTests=true|false 默认值:false。如果为true,则不会为新类创建“spec.ts”测试文件
3.3.6 enum
ng generate enum <name> [options]
ng g enum <name> [options]
为给定或默认项目生成新的通用枚举。
选项 名字 –lintFix=true|false 默认值:false.如果为true,则在生成枚举后应用lint修复 –project=project 要在其中创建枚举的项目的名称。默认值是工作区的已配置默认项目
3.3.7 guard
ng generate guard <name> [options]
ng g guard <name> [options]
在给定或默认项目中生成新的通用路由守卫定义。
选项 说明 –flat=true|false 默认值:true。如果为true,则在当前项目的顶级创建新文件 –implements 指定要实现的接口 –lintFix=true|false 默认值:false.如果为true,则在生成路由守卫后应用lint修复 –project=project 项目名称 –skipTests=true|false 默认值:false。如果为true,则不会为路由守卫创建“spec.ts”测试文件
3.3.8 interface
ng generate interface <name> <type> [options]
ng g interface <name> <type> [options]
在给定或默认项目中创建新的通用接口定义。
参数 说明 接口名字 将开发人员定义的类型添加到文件名中,格式为“name.type.ts”
选项 说明 –lintFix=true|false 默认值:false。如果为true,则在生成接口后应用lint修复 –project=project 项目名字
3.3.9 library
ng generate library <name> [options]
ng g library <name> [options]
在当前工作空间中创建新的通用库项目
选项 说明 –entryFile=entryFile 默认值:public_api。相对于工作空间根目录创建库的公共API文件的路径 –lintFix=true|false 默认值:false。如果为true,则在生成库后应用lint修复 –prefix=prefix 默认值:lib,别名:-p。要应用于生成的选择器的前缀 –skipInstall=true|false 默认值:false。如果为true,则不安装依赖包 –skipPackageJson=true|false 默认值:false。如果为true,则不会向“package.json”文件添加依赖项 –skipTsConfig=true|false 默认值:false。如果为true,则不更新“tsconfig.json”以添加新库的路径映射。在应用程序中使用库需要路径映射,但可以在此处禁用以简化开发
3.3.10 module
ng generate module <name> [options]
ng g module <name> [options]
在给定或默认项目中创建新的通用NgModule。
选项 说明 –flat=true|false 默认值:false。如果为true,则在当前项目根目录的顶级创建新文件 –lintFix=true|false 默认值:false。如果为true,则在生成模块后应用lint修复 –module=module 别名:-m。声明NgModule –project=project 项目名称 –routing=true|false 默认值:false。如果为true,则创建路由模块 –routingScope=Child|Root 默认值:Child。新路由模块的作用范围
3.3.11 pipe
ng generate pipe <name> [options]
ng g pipe <name> [options]
在给定或默认项目中创建新的通用管道。
选项 说明 –export=true|false 默认值:false。如果为true,则声明NgModule导出此管道 –flat=true|false 默认值: true。如果为true,则在项目的顶级创建文件 –lintFix=true|false 默认值:false。如果为true,则在生成管道后应用lint修正 –module=module 别名:-m.声明NgModule –project=project 项目名字 –skipImport=true|false 默认值:false。如果为true,则不会将此管道导入到拥有的NgModule中 –skipTests=true|false 默认值:false。如果为true,则不会为新管道创建“spec.ts”测试文件
3.3.12 service
ng generate service <name> [options]
ng g service <name> [options]
在给定或默认项目中创建新的通用服务。
选项 说明 –flat=true|false 默认值:true。如果为true,则在项目的顶级创建文件 –lintFix=true|false 默认值:false。如果为true,则在生成管道后应用lint修正 –project=project 项目名称 –skipTests=true|false 默认值:false。如果为true,则不会为新服务创建“spec.ts”测试文件
3.3.13 serviceWorker
ng generate serviceWorker [options]
ng g serviceWorker [options]
将此原理图传递给“run”命令以创建serviceWorker。
serviceWorker是浏览器在后台独立于网页运行的一段脚本。他通过域名标识不同的网页。网页通过注册自己的serviceWorker,可以将一些相对独立的任务丢到serviceWorker里面运行,并最终通过postMessage进行通信。
选项 说明 –configuration=configuration 默认值:production。应用服务工作者的配置 –project=project 项目名称 –target=target 默认值:build。应用服务工作者的目标
3.3.14 universal
ng generate universal [options]
ng g universal [options]
将此原理图传递给“run”命令,为应用程序设置服务器端渲染。
选项 说明 –appDir=appDir 默认值:app。应用程序文件夹的名称 –appId=appId 默认值:serverApp。用于转换的应用程序标识符 –clientProject=clientProject 相关客户端应用程序的名称。需要代替“项目” –main=main 默认值:main.server.ts。主入口点文件的名称 –rootModuleClassName=rootModuleClassName 默认值:AppServerModule。根NgModule类的名称 –rootModuleFileName=rootModuleFileName 默认值:app.server.module.ts。根NgModule文件的名称 –skipInstall=true|false 默认值:false。如果为true,则不安装依赖项的包 –test=test 测试入口点文件的名称 –testTsconfigFileName=testTsconfigFileName 默认值:tsconfig.spec。测试的TypeScript配置文件的名称 –tsconfigFileName=tsconfigFileName 默认值:tsconfig.server。TypeScript配置文件的名称
3.4 ng build
ng build <project> [options]
ng b <project> [options]
将Angular应用程序编译到给定输出路径中名为dist /的输出目录中。前提是必须在工作空间目录中执行。
执行ng build命令之后将会做下面几件事情:
Angular CLI 从 .angular-cli.json 文件中加载配置信息 Angular CLI 运行 Webpack 打包项目相关的 JavaScript 与 CSS 文件 打包后的资源,将被输出到配置文件中 outDir 所指定的目录,默认是输出到 dist 目录
选项 说明 –aot=true|false 默认值:false。是否使用AOT编译。AOT(预编译);JIT(即使编译) –baseHref=baseHref 设置 index.html 文件中 元素的链接地址 –buildEventLog=buildEventLog 构建事件协议事件的输出文件路径 –buildOptimizer=true|false 默认值:false。使用’aot’选项时,启用’@ angular-devkit / build-optimizer’优化 –commonChunk=true|false 默认值:true。使用包含跨多个包使用的代码的单独包 –configuration=configuration 别名:-c。指定构建目标,在angular.json的“configurations”部分中指定。每个目标都附带该目标的选项默认配置 –deleteOutputPath=true|false 默认值:true。在构建之前删除输出路径 –deployUrl=deployUrl 将部署文件的URL –es5BrowserSupport=true|false 默认值:false。启用有条件加载的ES2015 polyfill。 –extractCss=true|false 默认值:false。将全局样式中的css提取为css文件而不是js文件 –extractLicenses=true|false 默认值:false。在单独的文件中提取所有许可证 –forkTypeChecker=true|false 默认值:true。在fork进程中运行TypeScript类型检查器 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –i18nFile=i18nFile 用于i18n的本地化文件 –i18nFormat=i18nFormat 使用–i18n-file指定的本地化文件的格式 –i18nLocale=i18nLocale 用于i18n的语言环境 –i18nMissingTranslation=i18nMissingTranslation 如何处理i18n的缺失翻译 –index=index index HTML 文件对应的名字 –lazyModules 将延迟加载的NgModule文件列表。将自动发现延迟路由器模块 –main=main 相对于当前工作空间的应用程序主入口点的完整路径 –namedChunks=true|false 默认值:true。使用延迟加载的块的文件名 –ngswConfigPath=ngswConfigPath ngsw-config.json文件路径 –optimization=true|false 启用构建输出的优化 –outputHashing=none|all|media|bundles 默认值:none。定义输出文件名缓存清除散列模式 –outputPath=outputPath 新输出目录的完整路径,相对于当前工作空间。默认情况下,将输出写入当前项目中名为dist /的文件夹 –poll 启用并定义查看轮询时间段的文件(以毫秒为单位) –polyfills=polyfills polyfills文件的完整路径,相对于当前工作空间 –preserveSymlinks=true|false 默认值:false。解析模块时不要使用真实路径 –prod=true|false 如果为true,则将构建配置设置为生产目标 –profile=true|false 默认值:false。Chrome Profiler的输出配置文件事件 –progress=true|false 在构建时将进度记录到控制台 –resourcesOutputPath=resourcesOutputPath 相对于outputPath,将放置样式资源的路径 –serviceWorker=true|false 默认值:false。为生产版本生成serviceWorker配置 –showCircularDependencies=true|false 默认值:true。在构建上显示循环依赖性警告 –sourceMap=true|false 默认值:true。输出sourcemaps –statsJson=true|false 默认值:false。生成’stats.json’文件,可以使用’webpack-bundle-analyzer’等工具进行分析 –subresourceIntegrity=true|false 默认值:false。允许使用子资源完整性验证 –tsConfig=tsConfig TypeScript配置文件的完整路径,相对于当前工作空间 –vendorChunk=true|false 默认值:true。使用仅包含供应商库的单独捆绑包 –verbose=true|false 默认值:false。添加更多详细信息以输出日志记录 –watch=true|false 默认值:false。文件更改时运行构建
3.5 ng config
ng config <jsonPath> <value> [options]
在工作空间的angular.json文件中检索或设置Angular配置值。(查看或者设置angular.json文件中某个配置对应的值)
参数 说明 以JSON路径格式设置或查询配置键(configuration)。例如:“a[3].foo.bar [2]”。如果未提供新值,则返回此键的当前值。 如果提供,则为给指定的配置(configuration)设置新值
选项 说明 –global=true|false 默认值:false,别名:-g。如果为true,则访问调用方主目录中的全局配置 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息
ng config的使用我们举一个简单的例子来说明。比如我们有这样的一个angular.json(我们删掉了很多东西)
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"verify-demo": {
"sourceRoot": "src"
}
},
"defaultProject": "verify-demo"
}
获取 projects.verify-demo.sourceRoot 对应的值
ng config projects.verify-demo.sourceRoot
设置 projects.verify-demo.sourceRoot 对应的值为app
ng config projects.verify-demo.sourceRoot app
3.6 ng doc
ng doc <keyword> [options]
ng d <keyword> [options]
在浏览器中打开官方Angular文档(angular.io ),并搜索给定的关键字。
参数 说明 要搜索的关键字,如angular.io中的搜索栏中所提供
选项 说明 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –search=true|false 默认值:false,别名:-s。如果为true,则搜索angular.io的所有内容。否则,仅搜索API参考文档
3.7 ng e2e
ng e2e <project> [options]
ng e <project> [options]
构建并提供Angular应用程序,然后使用Protractor运行e2e测试。
必须从工作空间目录中执行。如果未提供项目名称,则将对所有项目执行
选项 说明 –configuration=configuration 别名:-c。构建目标,在angular.json的“configurations”部分中指定各个目标 –devServerTarget=devServerTarget 开发服务器目标以运行测试 –elementExplorer=true|false 默认值:false。启动Protractor的Element Explorer进行调试 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –host=host 默认值:localhost。监听地址 –port 用于为应用程序提供服务的端口 –prod=true|false 如果为true,则将构建配置设置为生产目标 –protractorConfig=protractorConfig Protractor配置文件的名称 –specs Override specs in the protractor config. –suite=suite Override suite in the protractor config –webdriverUpdate=true|false 默认值:true。尝试更新webdriver
3.8 ng help
ng help [options]
列出可用的命令及其简短描述。
选项 说明 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息
3.9 ng lint
ng lint <project> [options]
ng l <project> [options]
在给定项目文件夹中的Angular应用程序代码上运行linting工具。
选项 说明 –configuration=configuration 别名:-c。要使用的linting配置(angular.json文件里面configuration配置) –exclude 要从linting中排除的文件 –files 要包含在linting中的文件 –fix=true|false 默认值:false。修复了linting错误(可能会覆盖linted文件) –force=true|false 默认值:false。即使有linting错误也能成功 –format=format 默认值:prose。输出格式(prose, json, stylish, verbose, pmd, msbuild, checkstyle, vso, fileslist) –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –silent=true|false 默认值:false。显示输出文本 –tsConfig=tsConfig TypeScript配置文件的名称 –tslintConfig=tslintConfig TSLint配置文件的名称 –typeCheck=true|false 默认值:false。控制linting的类型检查
3.10 ng run
ng run <target> [options]
使用项目中定义的可选自定义构建器配置运行Architect目标。
Architect是CLI用于执行复杂任务(如编译)的工具,根据提供的配置(configurations),CLI命令运行Architect目标,例如build,serve,test和lint。每个命名目标都有一个默认配置,由“options”对象指定,以及“配置”对象中一组可选的命名备用配置。
选项 说明 –configuration=configuration 别名:-c。angular.json文件configuration节点配置的名字 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息
3.11 ng serve
ng serve <project> [options]
ng s <project> [options]
构建并运行应用程序,而且在工程里面的文件有改动之后会自动rebuild。
当执行ng serve命令后,将发生以下几件事情:
Angular CLI 从 .angular-cli.json 文件中加载配置信息。 Angular CLI 运行 Webpack 打包相关 JavaScript 和 CSS 文件。 Angular CLI 启动 webpack dev server 本地开发服务器,默认的地址是 localhost:4200。
选项 说明 –aot=true|false 默认值:false。是否使用AOT编译。AOT(预编译);JIT(即使编译) –baseHref=baseHref 正在构建的应用程序的基础URL –browserTarget=browserTarget 目标服务 –buildEventLog=buildEventLog 构建事件协议事件的输出文件路径 –commonChunk=true|false 使用包含跨多个包使用的代码的单独包 –configuration=configuration 别名:-c。构建目标,在angular.json的“configuration”部分中指定 –deployUrl=deployUrl 将部署文件的URL –disableHostCheck=true|false 默认值:false。不验证连接的客户端是否是允许的主机的一部分 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –hmr=true|false 默认值:false。启用热模块更换 –hmrWarning=true|false 默认值:true。启用–hmr选项时显示警告 –host=host 默认值:localhost。host对应的监听地址 –liveReload=true|false 默认值:true。是否使用实时重新加载来重新加载页面 –open=true|false 默认值:false,别名:-o。在默认浏览器中打开网址 –optimization=true|false 启用构建输出的优化 –poll 启用并定义查看轮询时间段的文件(以毫秒为单位) –port 默认值:4200。监听端口 –prod=true|false 如果为true,则将构建配置设置为生产目标 –progress=true|false 在构建时将进度记录到控制台 –proxyConfig=proxyConfig 代理配置文件 –publicHost=publicHost 指定浏览器客户端将使用的URL –servePath=servePath 应用程序的路径名 –servePathDefaultWarning=true|false 默认值:true。当deploy-url / base-href使用不支持的服务路径值时显示警告 –sourceMap=true|false 默认值:true。输出源图 –ssl=true|false 默认值:false。使用HTTPS服务 –sslCert=sslCert 用于提供HTTPS的SSL证书 –sslKey=sslKey 用于提供HTTPS的SSL密钥 –vendorChunk=true|false Use a separate bundle containing only vendor libraries –verbose=true|false 默认值:false。添加更多详细信息以输出日志记录 –watch=true|false 默认值:true。有改变的时候重新构建
3.12 ng test
ng test <project> [options]
ng t <project> [options]
在项目中运行单元测试。
Angular CLI 在新建项目的时候,自动为我们集成了 Karma test runner 测试框架
运行ng test命令之后,将会执行以下几个动作:
Angular CLI 从 .angular-cli.json 文件中加载配置信息。 Angular CLI 基于 .angular-cli.json 文件中的 Karma 相关的配置信息,运行 Karma。Karma 的配置文件默认在根目录下,文件名为 karma.conf.js 。 Karma 打开配置中设定的浏览器,默认是 Chrome。 Karma 然后指示浏览器 (Chrome) 使用 Karma 配置中指定的测试框架运行 src/test.ts。默认情况下,采用的是 Jasmine 框架。创建应用程序时,会自动创建 src/test.ts 文件。它预先配置为加载和配置测试Angular 应用程序所需的代码,并运行 src 目录中以 .spec.ts 结尾的所有文件。 Karma 将测试结果报告给控制台。 Karma 监听 src 目录下的文件的变化,然后自动运行单元测试。
选项 说明 –browsers=browsers 覆盖针对哪些浏览器测试运行 –codeCoverage=true|false 默认值:false。输出代码覆盖率报告 –codeCoverageExclude 要从代码覆盖范围中排除的Globs –configuration=configuration 别名:-c。构建目标,在angular.json的“configuration”部分中的某一个 –environment=environment 定义构建环境 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –karmaConfig=karmaConfig Karma配置文件的名称 –main=main 主入口点文件的名称 –poll 启用并定义查看轮询时间段的文件(以毫秒为单位) –polyfills=polyfills polyfills文件的名称 –preserveSymlinks=true|false 默认值:false。解析模块时不要使用真实路径 –prod=true|false 如果为true,则将构建配置设置为生产目标 –progress=true|false 在构建时将进度记录到控制台 –reporters Karma reporters to use. Directly passed to the karma runner –sourceMap=true|false 默认值:true。Output sourcemaps. –tsConfig=tsConfig TypeScript配置文件的名称
3.13 ng update
ng update [options]
更新您的应用程序及其依赖项。参见https://update.angular.io/。
比如可以通过运行以下命令,对核心框架和CLI的v7执行基本更新
ng update @angular/cli @angular/core
有关更新应用程序的详细信息和指导可以参考https://update.angular.io/。
选项 说明 –all=true|false 默认值:false。是否更新package.json中的所有包 –force=true|false 默认值:false。如果为false,如果安装的软件包与更新不兼容,则会出错 –from=from 要从中迁移的版本。仅适用于正在更新的单个程序包,且仅适用于仅迁移 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –migrateOnly=true|false 默认值:false。仅执行迁移,不更新已安装的版本 –next=true|false 默认值:false。使用最大的版本,包括beta和RC –packageManager=npm|yarn 默认值:npm。用于注册表设置的首选包管理器配置文件 –packages 要更新的包的名称 –registry=registry 要使用的NPM注册表 –to=to 要应用迁移的版本。仅适用于正在更新的单个程序包,且仅适用于仅迁移。需要指定。默认为检测到的已安装版本 –verbose=true|false 在更新过程中显示其他详细信息
3.14 ng version
ng version [options]
ng v [options]
输出Angular CLI对应的版本
选项 说明 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息
3.15 ng xi18n
ng xi18n <project> [options]
从源代码中提取i18n信息。
选项 说明 –browserTarget=browserTarget 提取的目标 –configuration=configuration 别名:-c。构建目标,在angular.json的“configuration”部分中某个目标 –help=true|false|json|JSON 默认值:false。在控制台中显示此命令的帮助消息 –i18nFormat=xmb|xlf|xlif|xliff|xlf2|xliff2 默认值:xlf。生成文件的输出格式 –i18nLocale=i18nLocale 指定应用程序的源语言 –outFile=outFile 要输出的文件的名称 –outputPath=outputPath 将放置输出的路径 –prod=true|false 如果为true,则将构建配置设置为生产目标 –progress=true|false 默认值:true。将进度记录到控制台