Error Not Yet Implemented with Webpack when run node dist/server.js

Question

I were following the guide to implement Angular Universal for my application. Everything worked out well until the last command node dist/server.js throw an error Error: NotYetImplemented

The full traceback is here: bash Error: NotYetImplemented at HTMLCanvasElement.exports.nyi (C:\Users\dist\server.js:50200:9) at C:\Users\dist\server.js:238837:55 at Object.<anonymous> (C:\Users\dist\server.js:228511:20) at svgNS (C:\Users\dist\server.js:228512:12) at Object.defineProperty.value (C:\Users\dist\server.js:228520:2) at __webpack_require__ (C:\Users\dist\server.js:20:30) at Object.<anonymous> (C:\Users\dist\server.js:228463:14) at __webpack_require__ (C:\Users\dist\server.js:20:30) at Object.<anonymous> (C:\Users\dist\server.js:228427:89) at __webpack_require__ (C:\Users\dist\server.js:20:30)

The current version of the packages in my application can be viewed here in package.json: json { "name": "application", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server", "serve:ssr": "node dist/server.js", "build:client-and-server-bundles": "ng build --production && ng build --production --app 1 --output-hashing=false", "webpack:server": "webpack --config webpack.server.config.js --progress --colors", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "pre-commit": [ "ng lint -fix" ], "dependencies": { "@angular-devkit/core": "0.3.1", "@angular/animations": "5.2.4", "@angular/cli": "1.6.8", "@angular/common": "5.2.4", "@angular/compiler": "5.2.4", "@angular/core": "5.2.4", "@angular/forms": "5.2.4", "@angular/http": "5.2.4", "@angular/platform-browser": "5.2.4", "@angular/platform-browser-dynamic": "5.2.4", "@angular/platform-server": "5.2.4", "@angular/router": "5.2.4", "@ngui/auto-complete": "0.14.4", "@nicky-lenaers/ngx-scroll-to": "0.3.1", "@types/flickity": "2.0.0", "angular-spinners": "5.0.2", "angular2-drag-scroll": "1.5.2", "bodymovin": "4.13.0", "bootstrap-sass": "3.3.7", "chart.js": "2.7.1", "core-js": "2.5.3", "express": "4.16.2", "flickity": "2.0.10", "font-awesome": "4.7.0", "jquery": "3.2.1", "ng-lottie": "0.3.1", "ng-recaptcha": "3.0.3", "ng-selectize": "1.1.3", "ng2-charts": "1.6.0", "ng2-device-detector": "1.0.1", "ng2-input-autocomplete": "0.0.11", "ngx-bootstrap": "2.0.2", "ngx-cookie": "2.0.1", "ngx-loading": "1.0.14", "node-sass": "4.7.2", "roboto-fontface": "0.8.0", "rxjs": "5.5.6", "selectize": "0.12.4", "slick-carousel": "1.8.1", "typescript": "^2.7.1", "zone.js": "0.8.20" }, "devDependencies": { "@angular/compiler-cli": "5.2.4", "@angular/language-service": "4.4.6", "@types/jasmine": "2.8.6", "@types/jasminewd2": "2.0.3", "@types/node": "8.9.3", "bootstrap-loader": "2.2.0", "chalk": "2.3.1", "codelyzer": "3.2.2", "copy-webpack-plugin": "4.4.1", "cssnano": "4.0.0-rc.2", "domino": "2.0.0", "enhanced-resolve": "4.0.0-beta.4", "extract-text-webpack-plugin": "3.0.2", "graceful-fs": "4.1.11", "jasmine-core": "2.99.1", "jasmine-spec-reporter": "4.2.1", "jsdom": "11.6.2", "karma": "1.7.1", "karma-chrome-launcher": "2.2.0", "karma-cli": "1.0.1", "karma-coverage-istanbul-reporter": "1.4.1", "karma-firefox-launcher": "1.1.0", "karma-jasmine": "1.1.1", "karma-jasmine-html-reporter": "0.2.2", "lottie-web": "5.1.7", "memory-fs": "0.4.1", "npm-run-all": "4.1.2", "protractor": "5.3.0", "sass-lint": "1.12.1", "tapable": "1.0.0-beta.5", "ts-loader": "3.5.0", "ts-node": "3.3.0", "tslint": "5.9.1", "uglify-js": "3.3.10", "webpack": "3.11.0", "webpack-dev-server": "2.11.1", "webpack-merge": "3.0.0", "webpack-node-externals": "1.6.0" } }

webpack.server.config.js

var path = require('path');
var webpack = require('webpack');

module.exports = {
  entry: {
    server: './src/server.ts'
  },
  resolve: {
    extensions: ['.js', '.ts']
  },
  target: 'node',
  // this makes sure we include node_modules and other 3rd party libraries
  externals: [/(node_modules|main\..*\.js)/],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: '[name].js'
  },
  module: {
    rules: [{
      test: /\.ts$/,
      loader: 'ts-loader'
    }]
  },
  plugins: [
    // Temporary Fix for issue: https://github.com/angular/angular/issues/11580
    // for 'WARNING Critical dependency: the request of a dependency is an expression'
    new webpack.ContextReplacementPlugin(
      /(.+)?angular(\\|\/)core(.+)?/,
      path.join(__dirname, 'src'), // location of your src
      {} // a map of your routes
    ),
    new webpack.ContextReplacementPlugin(
      /(.+)?express(\\|\/)(.+)?/,
      path.join(__dirname, 'src'), {}
    )
  ]
};

Anyone saw the same problem can give me some insights? Many thanks!