嗨我在Angular Universal的ng build之后运行server.ts时遇到了一个SyntaxError(npm start看看package.json)。
只有在我运行server.ts并且仅在我使用第三方模块(如Angularitics2或AdsenseModule)时才会发生这种情况。 ng服务非常好。我认为它与ng构建和转换有关。
我遵循本教程以使通用工作: https://coursetro.com/posts/code/68/Make-your-Angular-App-SEO-Friendly-
控制台出错:
[root@mainframe core]$ ts-node src/server.ts
/var/www/uni-app/core/node_modules/angulartics2/dist/core/angulartics2.js:1
(function (exports, require, module, __filename, __dirname) { import { Injectable } from '@angular/core';
^^^^^^
SyntaxError: Unexpected token import
at Object.exports.coreInThisContext (vm.js:78:16)
at Module._compile (module.js:543:28)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (module.js:488:32)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (/var/www/uni-app/core/dist/ngfactory/src/app/app.server.module.ngfactory.ts:32:1)
at Module._compile (module.js:571:32)
App.module.ts
import { Angulartics2Module, Angulartics2GoogleTagManager} from 'angulartics2';
@NgModule({
imports: [
Angulartics2Module.forRoot([ Angulartics2GoogleTagManager]),
FormsModule,
HttpModule,
routes,
server.ts
import 'reflect-metadata';
import 'zone.js/dist/zone-node';
import { platformServer, renderModuleFactory } from '@angular/platform-server'
import { enableProdMode } from '@angular/core'
import { AppServerModuleNgFactory } from '../dist/ngfactory/src/app/app.server.module.ngfactory'
import * as express from 'express';
import { readFileSync } from 'fs';
import { join } from 'path';
const PORT = 4000;
enableProdMode();
const app = express();
let template = readFileSync(join(__dirname, '..', 'dist', 'index.html')).toString();
app.engine('html', (_, options, callback) => {
const opts = { document: template, url: options.req.url };
renderModuleFactory(AppServerModuleNgFactory, opts)
.then(html => callback(null, html));
});
app.set('view engine', 'html');
app.set('views', 'src')
app.get('*.*', express.static(join(__dirname, '..', 'dist')));
app.get('*', (req, res) => {
res.render('index', { req });
});
app.listen(PORT, () => {
console.log(`listening on http://192.168.33.77:${PORT}!`);
});
的package.json
{
"name": "core",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"prestart": "ng build --prod && ngc && webpack",
"start": "ts-node src/server.ts"
},
"private": true,
"dependencies": {
"@angular/common": "^4.0.0",
"@angular/compiler": "^4.0.0",
"@angular/core": "^4.0.0",
"@angular/forms": "^4.0.0",
"@angular/http": "^4.0.0",
"@angular/platform-browser": "^4.0.0",
"@angular/platform-browser-dynamic": "^4.0.0",
"@angular/platform-server": "^4.1.3",
"@angular/router": "^4.0.0",
"angulartics2": "^2.2.1",
"@angular/animations": "^4.0.0",
"core-js": "^2.4.1",
"fs": "0.0.1-security",
"ng2-adsense": "^2.2.1",
"path": "^0.12.7",
"rxjs": "^5.1.0",
"zone.js": "^0.8.4"
},
"devDependencies": {
"@angular/cli": "1.0.0",
"@angular/compiler-cli": "^4.0.0",
"@types/jasmine": "2.5.38",
"@types/node": "~6.0.60",
"codelyzer": "~2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-coverage-istanbul-reporter": "^0.2.0",
"protractor": "~5.1.0",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.0",
"gulp": "~3.9.1",
"gulp-connect": "~2.3.1",
"gulp-imagemin": "~2.4.0",
"gulp-plumber": "~1.0.2",
"gulp-ruby-sass": "~2.0.6",
"gulp-uglyfly": "~1.4.2",
"gulp-order": "~1.1.1",
"gulp-concat": "~2.6.0",
"gulp-uglify": "~2.0.0",
"gulp-util": "~3.0.7",
"gulp-clean-css": "3.0.3",
"gulp-sequence": "^0.4.6",
"webpack": "~2.2.0",
"webpack-node-externals": "^1.5.4"
}
}