在 webpack 构建期间使用 aurelia-webpack-plugin 时出现意外的令牌错误答案

【问题标题】：Unexpected token error when using aurelia-webpack-plugin during webpack build在 webpack 构建期间使用 aurelia-webpack-plugin 时出现意外的令牌错误
【发布时间】：2017-02-21 11:33:49
【问题描述】：

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

操作系统：视窗 8 节点版本： 6.7.0 NPM 版本： 3.10.8 Webpack 版本网络包 2.2.1 浏览器：全部语言：打字稿 2.1 当前行为：

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

package.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"
  }

tsconfig.json

    {
  "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
    },    
};

【问题讨论】：

看来您使用的是过时版本的 aurelia-webpack。你能尝试更新骨架吗？
我使用aurelia-webpack-plugin 2.0.0-rc.2得到完全相同的错误

标签： webpack aurelia webpack-2

【解决方案1】：

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

https://github.com/aurelia/webpack-plugin/releases/tag/2.0.0-rc.5

支持以前版本的 webpack (2 - 3.5)

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

如果您是从头开始并希望自己动手，这里是具有良好启动配置的 webpack 的 repo：
https://github.com/jods4/aurelia-webpack-build

【讨论】：