1. 程式人生 > >Anjular-waring:global Angular與local Angular版本不一致

Anjular-waring:global Angular與local Angular版本不一致

現象

angular專案,執行 ng serve 指令後出現如下waring
Your global Angular CLI version (7.1.3) is greater than your local
version (1.4.9). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false".
** NG Live Development Server is listening on localhost:9200, open your browser on http://localhost:9200/ **

同時,執行 ng -v 指令後出現如下waring
Your global Angular CLI version (7.1.3) is greater than your local
version (1.4.9). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false".
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/

@angular/cli: 1.4.9
node: 10.14.2
os: win32 x64
@angular/animations: 4.4.7
@angular/common: 4.4.7
@angular/compiler: 4.4.7
@angular/core: 4.4.7
@angular/forms: 4.4.7
@angular/http: 4.4.7
@angular/platform-browser: 4.4.7
@angular/platform-browser-dynamic: 4.4.7
@angular/router: 4.4.7
@angular/cli: 1.4.9
@angular/compiler-cli: 4.4.6
typescript: 2.3.4
同時還出現的問題有,執行編譯後,本地頁面的佈局出現錯亂,與其他同事的本地除錯的頁面不一致(他們是好的)

根據waring資訊來看,應該是本地angular版本與全域性angular版本不一致導致的。經過網上查詢,也確實有很多類似問題。一般是angular cli 預設安裝最新版本導致的。
解決方案無非兩種:
本地版本向全域性版本靠攏
全域性版本向本地版本靠攏

解決方案(在專案中執行指令)

本地版本向全域性版本靠攏

解除安裝當前專案版本:

npm uninstall --save-dev angular-cli

清除快取確保解除安裝(在低版本的nodejs裡面清除快取使用的命令是 npm cache clean):

npm cache verify

安裝最新版本:

npm install --save-dev @angular/[email protected]

安裝/更新依賴:

npm install

OR

ng update @angular/cli

檢視版本:

ng --version
全域性版本向本地版本靠攏

解除安裝當前全域性版本:

npm uninstall -g @angular/cli

安裝指定版本(waring中提示的,專案配置檔案中也可檢視):

npm install -g @angular/[email protected]
解決後就不報這個waring了
PS F:\WorkSpacce-CHR\code> ng -v
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/               
@angular/cli: 1.4.9
node: 10.14.2
os: win32 x64
@angular/animations: 4.4.7
@angular/common: 4.4.7
@angular/compiler: 4.4.7
@angular/core: 4.4.7
@angular/forms: 4.4.7
@angular/http: 4.4.7
@angular/platform-browser: 4.4.7
@angular/platform-browser-dynamic: 4.4.7
@angular/router: 4.4.7
@angular/cli: 1.4.9
@angular/compiler-cli: 4.4.6
typescript: 2.3.4

參考來源:
Stack overflow 資料


createtime:2018-12-18