フロントエンド学習ノート:nodeとangular/cliの複数バージョンを管理する

5986 ワード

同じマシンで異なるバージョンのnode環境が必要であり、対応するangular/cliのバージョンも異なる.
nvmを使用してインストールと管理を行う
nvmのインストール(mac/linux版)
ダウンロード
wget https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh
bogon:~ wjy$ wget https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh
--2018-07-27 09:22:20--  https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh
\       raw.githubusercontent.com (raw.githubusercontent.com)... 151.101.88.133
     raw.githubusercontent.com (raw.githubusercontent.com)|151.101.88.133|:443...    。
    HTTP   ,      ... 200 OK
  :12819 (13K) [text/plain]
     : “install.sh”

install.sh          100%[===================>]  12.52K  2.98KB/s     4.2s    

2018-07-27 09:22:30 (2.98 KB/s) -     “install.sh” [12819/12819])

インストール
\sh install.sh
bogon:~ wjy$ \sh install.sh
=> Downloading nvm from git to '/Users/wjy/.nvm'
=> Cloning into '/Users/wjy/.nvm'...
remote: Counting objects: 267, done.
remote: Compressing objects: 100% (242/242), done.
remote: Total 267 (delta 31), reused 86 (delta 15), pack-reused 0
Receiving objects: 100% (267/267), 119.47 KiB | 2.00 KiB/s, done.
Resolving deltas: 100% (31/31), done.
=> Compressing and cleaning up git repository

=> Appending nvm source string to /Users/wjy/.bash_profile
=> Appending bash_completion source string to /Users/wjy/.bash_profile
=> You currently have modules installed globally with `npm`. These will no
=> longer be linked to the active version of Node when you install a new node
=> with `nvm`; and they may (depending on how you construct your `$PATH`)
=> override the binaries of modules installed with `nvm`:

/usr/local/lib
├── @angular/[email protected]
├── [email protected]
├── [email protected]
=> If you wish to uninstall them at a later point (or re-install them under your
=> `nvm` Nodes), you can remove them from the system Node as follows:

     $ nvm use system
     $ npm uninstall -g a_module

=> Close and reopen your terminal to start using nvm or run the following to use it now:

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion
bogon:~ wjy$ 

nodeのインストール
バージョンの決定:
新しい端末を開き、nvmバージョンを確認します.
nvm --version
bogon:~ wjy$ nvm --version
0.33.11

node 8をインストールする.9.1
nvm install 8.9.1
bogon:~ wjy$ nvm install 8.9.1
Downloading and installing node v8.9.1...
Downloading https://nodejs.org/dist/v8.9.1/node-v8.9.1-darwin-x64.tar.gz...
######################################################################## 100.0%
Computing checksum with shasum -a 256
Checksums matched!
Now using node v8.9.1 (npm v5.5.1)
Creating default alias: default -> 8.9.1 (-> v8.9.1)

node 8をインストールする.11.3
nvm install 8.11.3
Downloading and installing node v8.11.3...
Downloading https://nodejs.org/dist/v8.11.3/node-v8.11.3-darwin-x64.tar.gz...
######################################################################## 100.0%
Computing checksum with shasum -a 256
Checksums matched!
Now using node v8.11.3 (npm v5.6.0)

インストールされたnodeバージョンの確認
bogon:~ wjy$ nvm ls
         v8.9.1
->      v8.11.3
         system
default -> 8.9.1 (-> v8.9.1)
node -> stable (-> v8.11.3) (default)
stable -> 8.11 (-> v8.11.3) (default)
iojs -> N/A (default)
lts/* -> lts/carbon (-> v8.11.3)
lts/argon -> v4.9.1 (-> N/A)
lts/boron -> v6.14.3 (-> N/A)
lts/carbon -> v8.11.3

node 8に切り替える.9.1
bogon:~ wjy$ nvm use 8.9.1
Now using node v8.9.1 (npm v5.5.1)
bogon:~ wjy$ node -v
v8.9.1

node 8に切り替える.11.3同8.9.1
 
異なるバージョンのグローバルcliのインストール
angular cliは1.7にあるため.3の後に変化し、そのまま6に上昇した.x,ここでは8.9.1インストール1.7.3で、8.11で.3には現在安定する6.0を取り付ける.バージョン8
node8.9.1でグローバル1.7をインストール.3バージョンcli
wjydeMacBook-Pro:~ wjy$ nvm use 8.9.1
Now using node v8.9.1 (npm v5.5.1)
wjydeMacBook-Pro:~ wjy$ sudo npm install -g @angular/[email protected]
Password:
/***  ***/

インストール完了確認バージョン
wjydeMacBook-Pro:~ wjy$ ng -v

    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
    
Angular CLI: 1.7.3
Node: 8.9.1
OS: darwin x64
Angular: 
...

node811.3でグローバル6.0をインストール.8バージョンcli
wjydeMacBook-Pro:~ wjy$ nvm use 8.11.3
Now using node v8.11.3 (npm v5.6.0)
wjydeMacBook-Pro:~ wjy$ sudo npm install -g @angular/cli@latest
Password:
/***  ***/

インストール完了確認バージョン
wjydeMacBook-Pro:~ wjy$ ng -v

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

Angular CLI: 6.1.1
Node: 8.11.3
OS: darwin x64
Angular: 
... 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.7.1
@angular-devkit/core         0.7.1
@angular-devkit/schematics   0.7.1
@schematics/angular          0.7.1
@schematics/update           0.7.1
rxjs                         6.2.2
typescript                   2.7.2
    

異なるバージョンでの使用切り替え
wjydeMacBook-Pro:~ wjy$ nvm use 8.9.1
Now using node v8.9.1 (npm v5.5.1)