Angular CLI - 環境設定



要使用 Angular CLI,我們需要在系統上安裝 Node。讓我們詳細瞭解 Angular CLI 所需的環境設定。

下載 Node.js 存檔

Node.js 下載(位於 https://nodejs.com.tw/download/)下載最新版本的 Node.js 可安裝存檔檔案。在撰寫本教程時,不同作業系統上可用的版本列示如下:

作業系統 存檔名稱
Windows node-v6.3.1-x64.msi
Linux node-v6.3.1-linux-x86.tar.gz
Mac node-v6.3.1-darwin-x86.tar.gz
SunOS node-v6.3.1-sunos-x86.tar.gz

在 UNIX/Linux/Mac OS X 和 SunOS 上安裝

根據您的作業系統架構,下載並解壓存檔node-v6.3.1-osname.tar.gz到 /tmp,然後最終將解壓後的檔案移動到 /usr/local/nodejs 目錄。

例如:

$ cd /tmp

$ wgethttps://nodejs.com.tw/dist/v6.3.1/node-v6.3.1-linux-x64.tar.gz

$ tar xvfz node-v6.3.1-linux-x64.tar.gz

$ mkdir -p /usr/local/nodejs

$ mv node-v6.3.1-linux-x64/*/usr/local/nodejs

將 /usr/local/nodejs/bin 新增到 PATH 環境變數。

作業系統 輸出
Linux export PATH=$PATH:/usr/local/nodejs/bin
Mac export PATH=$PATH:/usr/local/nodejs/bin
FreeBSD export PATH=$PATH:/usr/local/nodejs/bin

在 Windows 上安裝

使用 MSI 檔案並按照提示安裝Node.js。預設情況下,安裝程式將 Node.js 分發到C:\Program Files\nodejs

安裝程式應在 windows PATH 環境變數中設定C:\ProgramFiles\nodejs\bin目錄。重新啟動任何開啟的命令提示符以使更改生效。

驗證安裝:執行檔案

在您的機器(Windows 或 Linux)上建立一個名為main.json的 js 檔案,其中包含以下程式碼:

/* Hello, World! program in node.js */
console.log("Hello, World!")

即時演示連結為 https://tutorialspoint.tw/execute_nodejs_online.php。

現在,使用 Node.js 直譯器執行 main.js 檔案以檢視結果:

$ node main.js

如果您的安裝一切正常,則應產生以下結果:

Hello, World!

現在,Node 已安裝。您可以執行以下命令來安裝 Angular CLI。

npm install -g @angular/cli

驗證安裝

現在,執行以下命令檢視結果:

$ ng --version

如果您的安裝一切正常,則應產生以下結果:

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / ? \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 9.1.0
Node: 12.16.1
OS: win32 x64

Angular:
...
Ivy Workspace:

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.901.0
@angular-devkit/core         9.1.0
@angular-devkit/schematics   9.1.0
@schematics/angular          9.1.0
@schematics/update           0.901.0
rxjs                         6.5.4

在 Windows 上,如果 ng 未被識別為內部或外部命令,請更新系統路徑變數以包含以下路徑。

C:\Users\<User Directory>\AppData\Roaming\npm
廣告

© . All rights reserved.