angular2升级angular6 过程遇到的问题

错误1

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve '@angular/core' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 10:0-24

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve '@angular/common' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 11:0-26

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve '@angular/forms' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 12:0-25

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve '@angular/http' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 13:0-24

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve '@angular/router' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 14:0-26

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve '@angularclass/hmr' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 16:0-28

ERROR in ./src/main.browser.ts
Module not found: Error: Can't resolve '@angularclass/hmr' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/main.browser.ts 7:12-40

ERROR in ./src/polyfills.browser.ts
Module not found: Error: Can't resolve 'zone.js/dist/zone' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/polyfills.browser.ts 27:0-28

ERROR in ./src/polyfills.browser.ts
Module not found: Error: Can't resolve 'zone.js/dist/long-stack-trace-zone' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/polyfills.browser.ts 35:4-49

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve 'rxjs/add/operator/map' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 18:0-32

ERROR in ./src/vendor.browser.ts
Module not found: Error: Can't resolve 'rxjs/add/operator/mergeMap' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src'
 @ ./src/vendor.browser.ts 19:0-37

ERROR in ./src/app/environment.ts
Module not found: Error: Can't resolve '@angular/core' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src\app'
 @ ./src/app/environment.ts 5:13-37
 @ ./src/main.browser.ts

ERROR in ./src/app/app.module.ts
Module not found: Error: Can't resolve '@angular/core' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src\app'
 @ ./src/app/app.module.ts 2:13-37
 @ ./src/app/index.ts
 @ ./src/main.browser.ts

ERROR in ./src/app/app.module.ts
Module not found: Error: Can't resolve '@angular/forms' in 'E:\mya4p\gtLbA4p\angular2-webpack-starter\src\app'
 @ ./src/app/app.module.ts 4:14-39
 @ ./src/app/index.ts
 @ ./src/main.browser.ts
ERROR in [default] 
Cannot find type definition file for 'hammerjs'.

ERROR in [default] 
Cannot find type definition file for 'jasmine'.

ERROR in [default] 
Cannot find type definition file for 'node'.

ERROR in [default] 
Cannot find type definition file for 'protractor'.

ERROR in [default] 
Cannot find type definition file for 'selenium-webdriver'.

解决方法

npm install @angular/common@latest @angular/compiler@latest @angular/compiler-cli@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest @angular/animations@latest typescript@latest --save

其实在升级过程中除此之外还遇到好多问题,最后我还是卸载了以钱的angular/cli,重新装了6.0版本的cli然后来重新构建项目用到的依赖。
在我引入UI框架ng-zorro-antd时候又报一堆错误:
错误2

ERROR in ./node_modules/ng-zorro-antd/src/ng-zorro-antd.less (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/less-loader/dist/cjs.js??ref--15-3!./node_modules/ng-zorro-antd/src/ng-zorro-antd.less)
Module build failed:

// https://github.com/ant-design/ant-motion/issues/44
.bezierEasingMixin();
^
Inline JavaScript is not enabled. Is it set in your options?
      in E:\projects\my-project\node_modules\ng-zorro-antd\src\style\color\bezierEasing.less (line 110, column 0)

解决方法
由于@angular/cli 6.0版本构建时下载的是less3.0,但是less3.0暂不支持javascriptEnabled 选项,所以你要降级到less2.7版本
错误3

ERROR in node_modules/@angular/cdk/overlay/typings/overlay-ref.d.ts(11,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@angular/cdk/overlay/typings/overlay-ref.d.ts(12,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Subject"' has no exported member 'Subject'.
node_modules/@angular/cdk/overlay/typings/position/connected-position-strategy.d.ts(12,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@angular/cdk/scrolling/typings/scroll-dispatcher.d.ts(10,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Subscription"' has no exported member 'Subscription'.
node_modules/@angular/cdk/scrolling/typings/scroll-dispatcher.d.ts(11,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@angular/cdk/scrolling/typings/scrollable.d.ts(9,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@angular/cdk/scrolling/typings/viewport-ruler.d.ts(10,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/ng-zorro-antd/src/anchor/nz-anchor.component.d.ts(2,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Subscription"' has no exported member 'Subscription'.
node_modules/ng-zorro-antd/src/auto-complete/nz-autocomplete.component.d.ts(2,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/ng-zorro-antd/src/carousel/nz-carousel.component.d.ts(2,10): error TS2305: Module '"E:/projects/my-project/node_modules/rxjs/Subscription"' has no exported member 'Subscription'.

解决方法
应该运行 npm install --save [email protected] 详见 https://github.com/NG-ZORRO/ng-zorro-antd/issues/1442
rxjs-compat 用于兼容 rxjs 5.x
错误4

npm ERR! path C:\Users\Administrator\AppData\Roaming\npm\ng
npm ERR! code EPERM
npm ERR! errno -4048
npm ERR! syscall open
npm ERR! Error: EPERM: operation not permitted, open 'C:\Users\Administrator\AppData\Roaming\npm\ng'
npm ERR!  { Error: EPERM: operation not permitted, open 'C:\Users\Administrator\AppData\Roaming\npm\ng'
npm ERR!   cause:
npm ERR!    { Error: EPERM: operation not permitted, open 'C:\Users\Administrator\AppData\Roaming\npm\ng'
npm ERR!      errno: -4048,
npm ERR!      code: 'EPERM',
npm ERR!      syscall: 'open',
npm ERR!      path: 'C:\\Users\\Administrator\\AppData\\Roaming\\npm\\ng' },
npm ERR!   stack: 'Error: EPERM: operation not permitted, open \'C:\\Users\\Administrator\\AppData\\Roaming\\npm\\ng\'',
npm ERR!   errno: -4048,
npm ERR!   code: 'EPERM',
npm ERR!   syscall: 'open',
npm ERR!   path: 'C:\\Users\\Administrator\\AppData\\Roaming\\npm\\ng' }

这个错误是在下载angular/cli时出现的
解决方法是
以管理员身份运行还是不可以解决,最后加了参数就OK了
npm install -g @angular/cli -no-optiona

最后给同样在升级过程中遇到问题的你一条建议,一定要在升级某个技术版本的时候,去关注该技术的github。

你可能感兴趣的:(angular2升级angular6 过程遇到的问题)