webpack - 在 webpack 构建期间使用 aurelia-webpack-plugin 时出现意外的 token 错误

Question

库版本:
aurelia-webpack-plugin@2.0.0-rc.1(分支:v2.0)

操作系统:
视窗 8
节点版本:
6.7.0
NPM 版本:
3.10.8
网络包版本
网络包 2.2.1
浏览器:
全部
语:
typescript 2.1
当前行为:

如果我们在 webpack 配置文件中使用 aurelia-webpack-plugin，我们会在 webpack 构建过程中遇到错误。错误显示“SyntaxError: Unexpected token =”



包.json

     "dependencies": {
    "aurelia-bootstrapper-webpack": "^1.0.0",
    "aurelia-event-aggregator": "^1.0.0",
    "aurelia-framework": "^1.0.1",
    "aurelia-history-browser": "^1.0.0",
    "aurelia-loader-webpack": "^1.0.2",
    "aurelia-logging-console": "^1.0.0",
    "aurelia-templating-binding": "^1.0.0",
    "aurelia-templating-resources": "^1.0.0",
    "aurelia-templating-router": "^1.0.0"
  },
  "devDependencies": {
    "aurelia-webpack-plugin": "git+https://github.com/aurelia/webpack-plugin.git#v2.0",
    "html-loader": "^0.4.3",
    "source-map-loader": "^0.1.5",
    "webpack": "^2.2.1"
  }

配置文件

    {
  "compilerOptions": {
    "target": "es5",
    "module": "amd",   
    "experimentalDecorators": true,
    "strictNullChecks": true,
    "moduleResolution": "node",
    "sourceMap": true,    
    "lib": [
      "es2017",
      "dom"
    ]
  },
  "awesomeTypescriptLoaderOptions": {
    "forkChecker": true
  },
  "exclude": [
    "node_modules",
    "build"  
  ]
}

webpack.config.js

const AureliaWebpackPlugin = require('aurelia-webpack-plugin');
var path = require('path');
// We need this to use the CommonsChunkPlugin.
var webpack = require('webpack');

const baseUrl = '/';
const rootDir = path.resolve();
const srcDir = path.resolve('src');
const outDir = path.resolve('build');


module.exports = {
    entry: {
        // Our app's entry point, this is set automatically by aurelia-webpack-plugin
        // using the files in the "src" folder that we're still going to create.
        // The app knows which of the files is our entry point because of the "aurelia-bootstrapper-webpack" 
        // who reads the entry point from the aurelia-app="main" in our index.html.
        'app': [],       
        //These are all the aurelia libraries, they will be bundled separately from our app's main code.
        //I tried to bundle everything together, with no success.
        'aurelia': [
            'aurelia-bootstrapper-webpack',
            'aurelia-polyfills',
            'aurelia-pal',
            'aurelia-pal-browser',
            'aurelia-binding',
            'aurelia-dependency-injection',
            'aurelia-event-aggregator',
            'aurelia-framework',
            'aurelia-history',
            'aurelia-history-browser',
            'aurelia-loader',
            'aurelia-loader-webpack',
            'aurelia-logging',
            'aurelia-logging-console',
            'aurelia-metadata',
            'aurelia-path',
            'aurelia-route-recognizer',
            'aurelia-router',
            'aurelia-task-queue',
            'aurelia-templating',
            'aurelia-templating-binding',
            'aurelia-templating-router',
            'aurelia-templating-resources'
        ]
    },
   // entry: 'main',
    output: {
        //This is the folder where our packed app will be after we run webpack.
        path: './build',
        filename: 'scripts/[name].bundle.js',
        sourceMapFilename: 'scripts/[name].bundle.js.map'
    },   
   // devtool: 'source-map',
    module: {

        loaders: [
            { test: /\.html$/, use: 'html-loader'},
            { test: /\.json$/, use: 'json-loader'} 
        ]
    },
    plugins: [

        new AureliaWebpackPlugin({
            root: rootDir,
            src: srcDir,           
            baseUrl: baseUrl
        }),
        new webpack.optimize.CommonsChunkPlugin({ name: ['aurelia'] })        
    ],
    // This is not necessary, it just changes the default port the
    // webpack-dev-server uses from 3000 to whatever you set here.
    devServer: {
        port: 53092
    },    
};

Answer 1

Aurelia 团队刚刚为 webpack4 发布了一个 webpack 插件版本
https://github.com/aurelia/webpack-plugin/releases/tag/3.0.0-rc.1

以前版本的 webpack (2 - 3.5) 支持
https://github.com/aurelia/webpack-plugin/releases/tag/2.0.0-rc.5

repo中有一个插件的详细wiki
https://github.com/aurelia/webpack-plugin/wiki

如果您是从头开始并且更喜欢自己动手，这里是具有良好启动配置的 webpack 仓库:
https://github.com/jods4/aurelia-webpack-build