---
# System prepended metadata

title: Angular 環境
tags: [Angular, ng-指令, ng-安裝, ng-測試, ng-建置環境]

---

# Angular 環境

## 套件管理介紹

### Chocolatey

Chocolatey 是一個 Windows 下的軟體包管理器 Non-Administrative install 非管理安裝 PowerShell 教學步驟

1. Save the script below as ChocolateyInstallNonAdmin.ps1.
2. Use the script below, determine where you might want Chocolatey installed if it is not to C:\ProgramData\chocoportable.
3. Open PowerShell.exe.
4. Run the following Set-ExecutionPolicy Bypass -Scope Process -Force;
5. Run .\ChocolateyInstallNonAdmin.ps1.

### Chocolatey(檔案命名：ChocolateyInstallNonAdmin.ps1)

### :eight_pointed_black_star:設置安裝目錄如下

* Set directory for installation – Chocolatey does not lock down the directory if not the default

```shell
$InstallDir=‘C:\ProgramData\chocoportable’ $env:ChocolateyInstall=“$InstallDir“
```

**PowerShell若也有受到限制，請繞過權限**

* If your PowerShell Execution policy is restrictive, you may not be able to get around that. Try setting your session to Bypass. 

```shell
Set-ExecutionPolicy Bypass -Scope Process -Force;
```

* All install options - offline, proxy, etc at <https://chocolatey.org/install>

```shell
iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1')) 
```

## 解壓縮/免安裝

### :eight_pointed_black_star:環境變數設定

在確定的路徑，EX：C:\Users\xxxxx\Nodejs

```console
rundll32 sysdm.cpl,EditEnvironmentVariables
```

### :eight_pointed_black_star:指令測試

:::info
:bangbang: 測試指令前，先將終端機重開 :bangbang:	
:::

在**PATH**變數欄位，將解壓縮路徑新增**值**

node

```console
node –v　
```

npm

```console
npm –v
```

![link](https://i.imgur.com/AUSSMMR.png)

### :eight_pointed_black_star:安裝Angular及測試

安裝

```console
npm install -g @angular/cli
```

測試

```console
ng version
```

```console
ng v
```

![](https://i.imgur.com/R2cHgjr.png)

#### 是否願意和谷歌團隊共享資料：N

> Would you like to share anonymous usage data about this project with the Angular Team at
> Google under Google’s Privacy Policy at https://policies.google.com/privacy? For more
> details and how to change this setting, see http://angular.io/analytics. (y/N)

#### 是否開啟嚴格模式(較嚴謹的檢查) ：YN

> Do you want to enforce stricter type checking and stricter bundle budgets in the workspace?  This setting helps improve maintainability and catch bugs ahead of time.  For more information, see https://angular.io/strict (y/N)

#### 是否預設配置路由：YN

> Would you like to add Angular routing?

#### 是否CSS配置前處理器：CSS 或 個人練習適用

> CSS
> SCSS   [ <https://sass-lang.com/documentation/syntax#scss> ]
> Sass   [ <https://sass-lang.com/documentation/syntax#the-indented-syntax> ]
> Less   [ <http://lesscss.org> ]
> Stylus [ <https://stylus-lang.com> ]

### GITHUB下載安裝

![](https://i.imgur.com/WcYW4Rj.png)

下載完B後，請安裝執行
[:link: 安裝執行 >>>> :point_left:](#安裝Angular及測試)

## 相關指令參考

### 找尋npm快取路徑位置(TEMP暫存資料夾)

```console
npm config get cache
```

### 清除暫存

```console
npm cache clean
```

### 安裝npm

```console
npm install
```

### 卸載-以angular為例

```console
npm uninstall -g @angular/cli [套件名稱]
```

### 升級

```console
npm update
```

### 資料夾位置

```console
CD 資料夾位置\資料夾位置
```

### 進到根目錄

```console
CD\
```

### 回到上一層

```console
CD ..
```

### 清除螢幕

```console
CLS
```

## 資料來源

### 保哥

[離線安裝完整 Angular 開發環境 (大型企業適用)](https://github.com/doggy8088/angular6-offline-install/)


### 離線安裝
[How to install angular-cli without internet](https://stackoverflow.com/questions/42841600/how-to-install-angular-cli-without-internet)
### Node

[NPM 套件管理工具常用指令](https://training.pada-x.com/docs/article.jsp?key=node-npm-simple-reference)
[Node.js - 安裝 npm 兩三事](https://ithelp.ithome.com.tw/articles/10211933)
[Node.js 是什麼？跟 JavaScript 有什麼關係](https://tw.alphacamp.co/blog/node-js-and-javascript)
[‘ng’ 不是內部或外部命令，也不是可執行的程式或批處理檔](https://iter01.com/573142.html)
[安裝指定版本](https://segmentfault.com/a/1190000024418942)
[如何在 Windows 平台變更 Node.js / npm 全域模組的預設安裝路徑](https://blog.miniasp.com/post/2015/09/01/Change-npm-default-global-installation-directory-for-nodejs-modules-in-Windows)

### 指令

[指令大全](https://alwaysfreesir.blogspot.com/2018/03/cmd.html)
[官方指令](https://docs.npmjs.com/cli/v7/commands/npm-config)
[Command Line指令教學，為什麼程式設計師都在用CMD](https://codinga-z.online/Coding/2021/05/04/command-line/)

還未實踐

* [[Node.js] 安裝 NVM (Node Version Manager) 來切換 Node.js 版本 for Windows]https://www.onejar99.com/nvm-install-for-windows/

###### tags: `Angular` `ng-建置環境` `ng-安裝` `ng-指令` `ng-測試`
