Angular 2 通用快速入门 - 要求 'ProvideRouter' 不工作
Angular 2 Universal Quickstart - require 'ProvideRouter' not working
我正在尝试使用 quickstart
为 Angular Universal 设置我的项目
但进展不顺利,尝试安装 typings 时出现很多错误:
Benjamins-MBP:vepo Ben$ sudo typings install node express body-parser serve-static express-serve-static-core mime --ambient
typings ERR! deprecated The "ambient" flag is deprecated. Please use "global" instead
Benjamins-MBP:vepo Ben$ sudo typings install node express body-parser serve-static express-serve-static-core mime --global
typings ERR! message Unable to find "express-serve-static-core" ("npm") in the registry.
typings ERR! message However, we found "express-serve-static-core" for 1 other source: "dt"
typings ERR! message You can install these using the "source" option.
typings ERR! message We could use your help adding these typings to the registry: https://github.com/typings/registry
typings ERR! caused by https://api.typings.org/entries/npm/express-serve-static-core/versions/latest responded with 404, expected it to equal 200
typings ERR!
typings ERR! cwd /Users/Ben/Development/vepo
typings ERR! system Darwin 16.1.0
typings ERR! command "/usr/local/bin/node" "/usr/local/bin/typings" "install" "node" "express" "body-parser" "serve-static" "express-serve-static-core" "mime" "--global"
typings ERR! node -v v6.9.1
typings ERR! typings -v 2.0.0
typings ERR!
typings ERR! If you need help, you may report this error at:
typings ERR! <https://github.com/typings/typings/issues>
Benjamins-MBP:vepo Ben$
然后我添加了 server.js 文件并尝试 运行 它 node server.js
:
我问了一个,但我无法成功实现答案:
require('angular2-universal-polyfills');
require ('path');
require ('express');
// Angular 2 Universal
require ('@angular/router/provideRouter');
require ('@angular/core/enableProdMode');
require ('angular2-universal/*');
// replace this line with your Angular 2 root component
require ('./app/AppModule');
require ('./app/app.routes')
收到此错误:
Benjamins-MBP:vepo Ben$ node server.js
module.js:471
throw err;
^
Error: Cannot find module '@angular/router/provideRouter'
at Function.Module._resolveFilename (module.js:469:15)
at Function.Module._load (module.js:417:25)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (/Users/Ben/Development/vepo/server.js:8:1)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
Benjamins-MBP:vepo Ben$
因为那个级别没有provideRouter。我如何使用 require 导入它?
这是我的 @angular
文件夹:
如何编辑我的 require
语句以正确导入所需的模块?
my package.json 显示正在使用的版本:
{
"name": "vepo",
"version": "1.0.0",
"scripts": {
"coverage": "istanbul cover ./test.js",
"lite-server-test": "lite-server --config=liteserver-test-config.json",
"test": "karma start karma.config.js",
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" \"sass --watch app\" \"sass --watch index.scss\" \"sass --watch global-constants.scss\" ",
"lite": "lite-server",
"tsc": "tsc",
"tsc:w": "tsc -w"
},
"bin": {
"e2e-test-start": "bin/e2e-test-start.js"
},
"license": "ISC",
"moduleResolution": "node",
"dependencies": {
"@angular/common": "~2.2.0",
"@angular/compiler": "~2.2.0",
"@angular/core": "~2.2.0",
"@angular/forms": "~2.2.0",
"@angular/http": "~2.2.0",
"@angular/platform-browser": "~2.2.0",
"@angular/platform-browser-dynamic": "~2.2.0",
"@angular/router": "~3.2.0",
"@angular/upgrade": "~2.2.0",
"@types/bootstrap": "^3.3.32",
"@types/google-maps": "^3.1.28",
"@types/jasmine": "^2.5.38",
"@types/jquery": "^2.0.34",
"@types/node": "^6.0.51",
"angular-in-memory-web-api": "~0.1.15",
"angular2-google-maps": "^0.15.0",
"angular2-modal": "^2.0.0",
"angular2-universal": "^2.1.0-rc.1",
"angular2-universal-polyfills": "^2.1.0-rc.1",
"body-parser": "^1.15.2",
"bootstrap": "^3.3.7",
"core-js": "^2.4.1",
"express": "^4.14.0",
"jquery": "v3.1.1",
"jshint": "^2.9.4",
"ng2-bs3-modal": "^0.10.4",
"ng2-popover": "0.0.9",
"preboot": "^4.5.2",
"protractor": "4.0.11",
"reflect-metadata": "^0.1.8",
"rxjs": "5.0.0-beta.12",
"systemjs": "0.19.39",
"tslint": "^4.0.2",
"typings": "^2.0.0",
"zone.js": "^0.6.25"
},
"devDependencies": {
"@types/google-maps": "^3.1.28",
"angular-mocks": "^1.5.8",
"codelyzer": "1.0.0-beta.0",
"concurrently": "^3.0.0",
"core-js": "^2.4.1",
"del": "latest",
"gulp": "^3.9.1",
"gulp-changed": "^1.3.2",
"gulp-concat": "^2.6.1",
"gulp-imagemin": "^3.1.1",
"gulp-jshint": "^2.0.4",
"gulp-minify-html": "^1.0.6",
"gulp-sass": "latest",
"gulp-sourcemaps": "latest",
"gulp-strip-debug": "^1.1.0",
"gulp-tslint": "latest",
"gulp-typescript": "latest",
"gulp-uglify": "^2.0.0",
"istanbul": "^0.4.5",
"jasmine": "~2.4.1",
"karma": "latest",
"karma-chrome-launcher": "latest",
"karma-cli": "^1.0.1",
"karma-coverage": "latest",
"karma-htmlfile-reporter": "^0.3.4",
"karma-jasmine": "latest",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-mocha-reporter": "latest",
"karma-phantomjs2-launcher": "latest",
"karma-story-reporter": "latest",
"lite-server": "latest",
"path": "latest",
"phantomjs2": "latest",
"protractor-jasmine2-html-reporter": "0.0.6",
"require-dir": "latest",
"systemjs-builder": "latest",
"tslint": "latest",
"typescript": "latest"
}
}
我认为你应该使用 provideRoutes 而不是 provideRouter
。
我正在尝试使用 quickstart
为 Angular Universal 设置我的项目但进展不顺利,尝试安装 typings 时出现很多错误:
Benjamins-MBP:vepo Ben$ sudo typings install node express body-parser serve-static express-serve-static-core mime --ambient
typings ERR! deprecated The "ambient" flag is deprecated. Please use "global" instead
Benjamins-MBP:vepo Ben$ sudo typings install node express body-parser serve-static express-serve-static-core mime --global
typings ERR! message Unable to find "express-serve-static-core" ("npm") in the registry.
typings ERR! message However, we found "express-serve-static-core" for 1 other source: "dt"
typings ERR! message You can install these using the "source" option.
typings ERR! message We could use your help adding these typings to the registry: https://github.com/typings/registry
typings ERR! caused by https://api.typings.org/entries/npm/express-serve-static-core/versions/latest responded with 404, expected it to equal 200
typings ERR!
typings ERR! cwd /Users/Ben/Development/vepo
typings ERR! system Darwin 16.1.0
typings ERR! command "/usr/local/bin/node" "/usr/local/bin/typings" "install" "node" "express" "body-parser" "serve-static" "express-serve-static-core" "mime" "--global"
typings ERR! node -v v6.9.1
typings ERR! typings -v 2.0.0
typings ERR!
typings ERR! If you need help, you may report this error at:
typings ERR! <https://github.com/typings/typings/issues>
Benjamins-MBP:vepo Ben$
然后我添加了 server.js 文件并尝试 运行 它 node server.js
:
我问了一个
require('angular2-universal-polyfills');
require ('path');
require ('express');
// Angular 2 Universal
require ('@angular/router/provideRouter');
require ('@angular/core/enableProdMode');
require ('angular2-universal/*');
// replace this line with your Angular 2 root component
require ('./app/AppModule');
require ('./app/app.routes')
收到此错误:
Benjamins-MBP:vepo Ben$ node server.js
module.js:471
throw err;
^
Error: Cannot find module '@angular/router/provideRouter'
at Function.Module._resolveFilename (module.js:469:15)
at Function.Module._load (module.js:417:25)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (/Users/Ben/Development/vepo/server.js:8:1)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
Benjamins-MBP:vepo Ben$
因为那个级别没有provideRouter。我如何使用 require 导入它?
这是我的 @angular
文件夹:
如何编辑我的 require
语句以正确导入所需的模块?
my package.json 显示正在使用的版本:
{
"name": "vepo",
"version": "1.0.0",
"scripts": {
"coverage": "istanbul cover ./test.js",
"lite-server-test": "lite-server --config=liteserver-test-config.json",
"test": "karma start karma.config.js",
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" \"sass --watch app\" \"sass --watch index.scss\" \"sass --watch global-constants.scss\" ",
"lite": "lite-server",
"tsc": "tsc",
"tsc:w": "tsc -w"
},
"bin": {
"e2e-test-start": "bin/e2e-test-start.js"
},
"license": "ISC",
"moduleResolution": "node",
"dependencies": {
"@angular/common": "~2.2.0",
"@angular/compiler": "~2.2.0",
"@angular/core": "~2.2.0",
"@angular/forms": "~2.2.0",
"@angular/http": "~2.2.0",
"@angular/platform-browser": "~2.2.0",
"@angular/platform-browser-dynamic": "~2.2.0",
"@angular/router": "~3.2.0",
"@angular/upgrade": "~2.2.0",
"@types/bootstrap": "^3.3.32",
"@types/google-maps": "^3.1.28",
"@types/jasmine": "^2.5.38",
"@types/jquery": "^2.0.34",
"@types/node": "^6.0.51",
"angular-in-memory-web-api": "~0.1.15",
"angular2-google-maps": "^0.15.0",
"angular2-modal": "^2.0.0",
"angular2-universal": "^2.1.0-rc.1",
"angular2-universal-polyfills": "^2.1.0-rc.1",
"body-parser": "^1.15.2",
"bootstrap": "^3.3.7",
"core-js": "^2.4.1",
"express": "^4.14.0",
"jquery": "v3.1.1",
"jshint": "^2.9.4",
"ng2-bs3-modal": "^0.10.4",
"ng2-popover": "0.0.9",
"preboot": "^4.5.2",
"protractor": "4.0.11",
"reflect-metadata": "^0.1.8",
"rxjs": "5.0.0-beta.12",
"systemjs": "0.19.39",
"tslint": "^4.0.2",
"typings": "^2.0.0",
"zone.js": "^0.6.25"
},
"devDependencies": {
"@types/google-maps": "^3.1.28",
"angular-mocks": "^1.5.8",
"codelyzer": "1.0.0-beta.0",
"concurrently": "^3.0.0",
"core-js": "^2.4.1",
"del": "latest",
"gulp": "^3.9.1",
"gulp-changed": "^1.3.2",
"gulp-concat": "^2.6.1",
"gulp-imagemin": "^3.1.1",
"gulp-jshint": "^2.0.4",
"gulp-minify-html": "^1.0.6",
"gulp-sass": "latest",
"gulp-sourcemaps": "latest",
"gulp-strip-debug": "^1.1.0",
"gulp-tslint": "latest",
"gulp-typescript": "latest",
"gulp-uglify": "^2.0.0",
"istanbul": "^0.4.5",
"jasmine": "~2.4.1",
"karma": "latest",
"karma-chrome-launcher": "latest",
"karma-cli": "^1.0.1",
"karma-coverage": "latest",
"karma-htmlfile-reporter": "^0.3.4",
"karma-jasmine": "latest",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-mocha-reporter": "latest",
"karma-phantomjs2-launcher": "latest",
"karma-story-reporter": "latest",
"lite-server": "latest",
"path": "latest",
"phantomjs2": "latest",
"protractor-jasmine2-html-reporter": "0.0.6",
"require-dir": "latest",
"systemjs-builder": "latest",
"tslint": "latest",
"typescript": "latest"
}
}
我认为你应该使用 provideRoutes 而不是 provideRouter
。