简介

Angular CLI 用于创建项目，生成应用和库代码，以及执行各种持续开发任务，比如测试、打包和部署。

Git 的安装与配置

Angular CLI 创建项目时需要用到 Git，否则会提示 git: not found，所以我们先安装 Git。

Windows

下载地址：https://gitforwindows.org/，下载后打开，按照提示操作即可。

Linux

见：https://git-scm.com/download/linux

macOS

见：https://git-scm.com/download/mac

配置全局用户名和邮箱

Angular CLI 创建项目时会使用 Git 全局用户名和邮箱，如果没有配置会提示如下：

Author identity unknown * Please tell me who you are.

Run

git config —global user.email “you@example.com” git config —global user.name “Your Name”

to set your account’s default identity. Omit —global to set the identity only in this repository.

fatal: unable to auto-detect email address (got ‘xxx@xxx.(none)’)

  1. # 查看 Git 配置
  2. $ git config --list
  3. # 配置 Git 全局用户名
  4. $ git config --global user.name "用户名"
  5. # 配置 Git 全局邮箱
  6. $ git config --global user.email "邮箱"

安装 Angular CLI

  1. # 安装 Angular CLI。-g 为全局安装，包会下载到 npm config get prefix 所在目录
  2. $ npm install -g @angular/cli
  3. …………
  4. ? Would you like to share anonymous usage data with the Angular Team at Google under Google’s Privacy Policy at https://policies.google.com/privacy? For more details
  5.  and
  6. how to change this setting, see https://angular.io/analytics. (y/N) # 是否与谷歌的 Angular 团队分享匿名使用数据，默认否即可
  7. + @angular/cli@12.0.1
  8. added xxx packages from xxx contributors in xx.xxxs

创建 Angular 项目并运行

  1. # 创建项目。--skip-install 为跳过 npm 包依赖的安装，--routing 为添加路由，--style=xxx 为选择 CSS 预编译器
  2. $ ng new ng-demo --skip-install
  3. ? Would you like to add Angular routing? (y/N)    # 是否添加 Angular 路由，暂时不需要
  4. ? Which stylesheet format would you like to use?  # 选择 CSS 预编译期
  5.   CSS
  6. > SCSS   [ https://sass-lang.com/documentation/syntax#scss                ]
  7.   Sass   [ https://sass-lang.com/documentation/syntax#the-indented-syntax ]
  8.   Less   [ http://lesscss.org                                             ]
  9. …………
  10.     Successfully initialized git.
  12. # 进入项目目录
  13. $ cd ng-demo
  15. # 如果在创建项目时跳过 npm 包依赖安装（--skip-install）的话需要先安装 npm 包依赖
  16. $ npm install
  17. …………
  18. added xxxx packages from xxxx contributors in xxx.xxxs
  20. # 运行项目方式一：通过 ng 命令
  21. $ ng serve --open
  23. # 运行项目方式二：通过 package.json 中定义的命令
  24. $ npm start
  25. …………
  26. ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

运行后浏览器会自动打开项目主页：
Snipaste_2021-05-26_17-50-03.png

问题

An unhandled exception occurred: spawn EPERM See “……\angular-errors.log” for further details.

删除项目目录中的 package-lock.json 文件和 node_modules 文件夹，重新安装 npm 包依赖即可。

参考来源