Angular 通用意外令牌 { 在 npm run start:ssr

Question

我正在使用 Angular Universal，并使用以下代码构建我的页面：npm run build:ssr，出现 0 个错误。然后我运行：npm run serve:ssr 并得到这个错误：

\node_modules\ngx-select-dropdown\dist\components\ngx-select-dropdown-component\ngx-select-dropdown.component.js:9

     (ngx-select-dropdown)    import { Component, Input, EventEmitter, Output, HostListener, ViewChildren... 
                                     ^
        SyntaxError: Unexpected token {

似乎是 ngx-select-dropdown 导致了这个错误。如何修复此错误以便我可以运行 ssr ？

Tsconfig：

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

Answer 1

在您的 webpack.server.config.js 文件中尝试添加外部配置

const nodeExternals = require('webpack-node-externals');
module.exports = {
...
  target: 'node',
  externals: [nodeExternals({
    // this WILL include
    whitelist: [
        /^ngx-bootstrap/,
        /^ngx-select-dropdown/
    ]
  })],
  resolve: {
    extensions: ['.ts', '.js']
  },
...