---
title: AnularCLI 指令
tags: Angular , FrontEnd
---

# Angular 指令
* Node.js：https://nodejs.org/en/
* Angular CLI：npm install -g @angular/cli
* Angular Material：ng add @angular/material
* 專案建置：ng new 專案名稱 (檔案位置取決於輸入指令時的資料夾位置)
* 專案啟動：ng serve (於要啟動之專案資料夾輸入)

--open (-o) → 啟動完自動開啟頁面
--port portNumber → 自訂啟動頁面使用的 port 

* 組件(元件)建置：ng generate component 組件(元件)名稱 or ng g component
* ng g component 放置路徑/some-name --flat
* 使用Free Template前置：npm install

若遇版本問題：
npm install --legacy-peer-deps (不要自動安裝 peerDependencies 套件)
npm install --force (强制重新安装 module)
yarn install

VSCode
* 輸入 quote style → 找到 TypeScript> Preference: Quote Style → (下拉選單) 選取single
* Angular Extension Pack
* Auto Import
* Eclipse Keymap: 可將快捷鍵大致上改成與Eclipse相同
* vscode-icons: 各種檔案圖示。裝完後須點擊 Set File Icon Theme
* Fold Level: 收折程式碼區塊。須另外設定，可配合快捷鍵使用

[專案版本升級](https://update.angular.io/)