1.初始化
首先我們需要使用npm安裝angular-cli到全域性環境
npm install -g @angular/cli
複製程式碼如果npm沒有辦法安裝，請使用cnpm試試。
2. 建立專案
使用下面的命令建立一個例項專案，用於後面我們的演示
ng new angular-frontend
複製程式碼3. 專案結構
建立完成之後，專案的目錄結構應該是這樣的
├── README.md
├── angular.json
├── e2e
│ ├── protractor.conf.js
│ ├── src
│ │ ├── app.e2e-spec.ts
│ │ └── app.po.ts
│ └── tsconfig.e2e.json
├── node_modules
├── package.json
├── src
│ ├── app
│ │ ├── app.component.css
│ │ ├── app.component.html
│ │ ├── app.component.spec.ts
│ │ ├── app.component.ts
│ │ └── app.module.ts
│ ├── assets
│ ├── browserslist
│ ├── environments
│ │ ├── environment.prod.ts
│ │ └── environment.ts
│ ├── favicon.ico
│ ├── index.html
│ ├── karma.conf.js
│ ├── main.ts
│ ├── polyfills.ts
│ ├── styles.css
│ ├── test.ts
│ ├── tsconfig.app.json
│ ├── tsconfig.spec.json
│ └── tslint.json
├── tsconfig.json
└── tslint.json
複製程式碼到這裡，我們就初始化好一個angular的專案了。
4.啟動專案
npm install
ng serve
複製程式碼如果你使用cnpm install安裝依賴包，然後啟動的時候，卡住在90%左右不動了，麻煩刪除node_modules目錄，使用yarn或者npm安裝。沒法使用npm？那你用yarn吧，應該沒有問題。
啟動完成之後，打來瀏覽器訪問：http://localhost:4200/
看到一個很大很紅的angular的圖示，那就恭喜你，開發環境搭建好了。
angular的開發環境蛋疼的很，如果可以的話，建議你換成react的專案。