尝试运行 Angular 通用时出错 "Unexpected token import"

Question

我正在尝试制作 Angular 通用版，但我遇到了 "ts-node server.ts" 的问题。输出记录如下：

$ npm run start

> prestart public-site
> ng build --prod && ngc

 12% building modules 24/32 modules 8 active ...lic-site/src/styles.scssNode#moveTo was deprecated. Use Container#append.
Hash:                                                               
Time: 76999ms
chunk    {0} 0.chunk.js 11.9 kB {1} {2} {3} {4} {5} {6} 
chunk   {14} inline.bundle.js (inline) 0 bytes

> start public-site
> ts-node src/server.ts

public-site/node_modules/md2/module.js:7
import { NgModule } from '@angular/core';
^^^^^^
SyntaxError: Unexpected token import
    at createScript (vm.js:53:10)
    at Object.runInThisContext (vm.js:95:10)
    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> (public-site/src/app/app.module.ts:11:1)

npm ERR! Darwin 16.5.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "start"
npm ERR! node v7.10.0
npm ERR! npm  v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! start: `ts-node src/server.ts`
npm ERR! Exit status 1
npm ERR!

如果您知道如何解决这个问题，我们将不胜感激。

Answer 1

应转译所有 3d 方库。 ts-node 不转译 es2015 模块。我使用 webpack 来转译像@angular/material 和@ngx-translate 这样的模块。查看我存储库中的示例：https://github.com/SergiusSidorov/cli-universal-demo

希望对你有所帮助。

Answer 2

请注意 hammerjs 和 jquery 会导致问题，hammerjs 是流行的 Material 2 库的一部分，因此它是一个常见问题对于进行此过渡的人。

最糟糕的是你可以取出第三方库并一个一个地重新添加它们并每次启动服务器以查看它是否有效。

您还可以像这样限制在浏览器中呈现某项内容的时间；

import { PLATFORM_ID } from '@angular/core';
 import { isPlatformBrowser, isPlatformServer } from '@angular/common';

 constructor(@Inject(PLATFORM_ID) private platformId: Object) { ... }

 ngOnInit() {
   if (isPlatformBrowser(this.platformId)) {
      // Client only code.
      ...
   }
   if (isPlatformServer(this.platformId)) {
     // Server only code.
     ...
   }
 }

- 从此处找到的 universal-starter 摘录：https://github.com/angular/universal-starter

因此，如果您需要使用jquery，请确保您拨打的任何电话都在'isPlatformBrowser'内，因为jquery和其他类似的库使用 DOM 并且节点后端不存在 DOM，从而导致错误。

尝试运行 Angular 通用时出错 "Unexpected token import"

Error "Unexpected token import" when trying to run Angular Universal

node.js

typescript

angular-universal

angular

尝试 运行 Angular 通用时出错 "Unexpected token import"

Error "Unexpected token import" when trying to run Angular Universal

node.js

typescript

angular-universal

angular

尝试运行 Angular 通用时出错 "Unexpected token import"