ng2

angularjs2的環境問題解決了很久。

百度到的答案也是各類各樣還解決不了個人問題。

好在這幾天通過不斷的測試終於給解決了。

 

ERROR in AppModule is not an NgModule


ERROR in ./src/main.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
    at Object.getNewLineCharacter (d:\web\myNg\ng2\node_modules\typescript\lib\typescript.js:8062:20)
    at Object.createCompilerHost (d:\web\myNg\ng2\node_modules\typescript\lib\typescript.js:44978:26)
    at Object.ngcLoader (d:\web\myNg\ng2\node_modules\@ngtools\webpack\src\loader.js:338:33)
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts


ERROR in ./src/polyfills.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
    at Object.getNewLineCharacter (d:\web\myNg\ng2\node_modules\typescript\lib\typescript.js:8062:20)
    at Object.createCompilerHost (d:\web\myNg\ng2\node_modules\typescript\lib\typescript.js:44978:26)
    at Object.ngcLoader (d:\web\myNg\ng2\node_modules\@ngtools\webpack\src\loader.js:338:33)
 @ multi ./src/polyfills.ts
webpack: Failed to compile.

出現這個錯誤的緣由是本地typescript版本衝突了。可是我不知道npm爲何會這樣。網上說它的機制按理說不是會致使版本衝突的問題。沒有研究過。

 

首先：

$ npm ls typescript

輸入這個命令查看項目的typescript版本和依賴。

發現出現2個不一樣的版本在各個地方了。

因爲angular\cli依賴的是2.1.6，這個是自動生成的，總不能去node_module裏面去找package.json改吧。無法改。放棄。
ng2@0.0.0 d:\web\myNg\ng2
+-- @angular/cli@1.0.0-rc.1 -> d:\web\myNg\ng2\node_modules\.1.0.0-rc.1@@angular\cli
| +-- @angular/compiler-cli@2.4.9
| | +-- @angular/tsc-wrapped@0.5.2
| | | `-- typescript@2.1.6  deduped extraneous
| | `-- typescript@2.1.6  extraneous
| +-- @angular/tsc-wrapped@0.5.2
| | +-- tsickle@0.2.6
| | | `-- typescript@2.1.6  extraneous
| | `-- typescript@2.1.6  extraneous
| +-- @ngtools/webpack@1.2.12
| | `-- typescript@2.1.6  extraneous
| `-- typescript@2.1.6
`-- typescript@2.0.10

 

那麼另外一個2.0.10是在項目的package.json中配置的。這個雖然是angular/cli生成的，可是是在咱們本身的項目裏面，因此很好改，咱們把這裏的typescript改爲angular/cli本身依賴的那個版本。

 

"typescript": "~2.0.0"

把這個改爲

 

 

"typescript": "~2.1.0"

~表示npm會自動下載離他最近的一個小版本。好比個人電腦上面就是2.1.6。這樣的話，就是angular/cli本身依賴的徹底一致了。

 

再次

$ npm ls typescript

發現，版本一致了。
ng2@0.0.0 d:\web\myNg\ng2
+-- @angular/cli@1.0.0-rc.1 -> d:\web\myNg\ng2\node_modules\.1.0.0-rc.1@@angular\cli
| `-- typescript@2.1.6
`-- typescript@2.1.6  -> d:\web\myNg\ng2\node_modules\.2.1.6@typescript

 

$ ng serve
** NG Live Development Server is running on http://localhost:4200 **
Hash: b21dc5aadbb6f2b69213
Time: 10251ms
chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 158 kB {4} [initial] [rendered]
chunk    {1} main.bundle.js, main.bundle.js.map (main) 3.14 kB {3} [initial] [rendered]
chunk    {2} styles.bundle.js, styles.bundle.js.map (styles) 9.84 kB {4} [initial] [rendered]
chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 2.6 MB [initial] [rendered]
chunk    {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]
webpack: Compiled successfully.

 

 

搞定。在這裏作個筆記，但願能幫到以後遇到的人。畢竟這玩意剛接觸太浪費時間了。

對了，安裝環境的時候記得用cnpm install。原生的npm install安裝會報錯，緣由是node-sass被牆了