Question

我使用karma + jasmine为vue和webpack编写测试用例，它曾经有效。但是在我将vue升级为1到2之后，并相应地更新了vue-loader，它开始出错。

现在，当我运行karma start karma.config.js时，它会给我一个错误：

Chrome 53.0.2785（Windows 7 0.0.0）错误未捕获的SyntaxError：意外的令牌导出 at test / index.js：8995

我的 karma.config.js 是：

var webpackConf = require('./webpack.config.js')
delete webpackConf.entry

module.exports = function (config) {
  config.set({
    browsers: ['Chrome'],
    frameworks: ['jasmine'],
    reporters: ['progress', 'html'],

    htmlReporter: {
      outputFile: 'tests/unit-test.html',
      // Optional 
      pageTitle: 'Unit Tests',
       subPageTitle: 'A sample project description',
       groupSuites: true,
       useCompactStyle: true,
       useLegacyStyle: true
    },
    // this is the entry file for all our tests.
    files: [
      {pattern: './test/index.js', watched: false},
    ],
    // we will pass the entry file to webpack for bundling.
    preprocessors: {
      './test/index.js': ['webpack']
    },
    // use the webpack config
    webpack: webpackConf,
    // avoid walls of useless text
    webpackMiddleware: {
      noInfo: true
    },
    singleRun: true,
    plugins: [
      'karma-chrome-launcher',
      'karma-jasmine',
      'karma-webpack',
      'karma-htmlfile-reporter'
    ]
  })
}

我的 webpack.config.js 是：

var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var webpack = require('webpack');

module.exports = {
    entry: ['webpack-hot-middleware/client','./index.js'],
    output: {
        path: path.resolve(__dirname, '../output/static'),
        publicPath: '/',
        //filename: '[name].[hash].js'
        filename: 'main.js'
        //chunkFilename: '[id].[chunkhash].js'
    },
    resolve: {
        alias: {
        'vue$': 'vue/dist/vue.common.js'
        },
        extensions: ['', '.js', '.vue']
    },
    module: {
        loaders: [
            {
                test: /\.vue$/, 
                loader: 'vue'   
            },
            {
                test: /\.js$/,
                loader: 'babel?presets=es2015',
                exclude: /node_modules/
            },
            {
                test: /\.scss$/,
                loaders: ["style", "css", "sass"]
            }
        ]
    },
       plugins: [
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin(),
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: path.resolve(__dirname, 'index.html'),
            inject: true
        })
    ]
}

看起来es6导出语法未正确翻译。另外，我不知道在哪里查看 test / index.js：8995 ，因为这是由webpack自动生成的。真正的 index.js 非常简单，只有2行：

var testsContext = require.context('.', true, /\.spec\.js$/)
testsContext.keys().forEach(testsContext)

如何调试此问题以及如何解决问题？

karma Uncaught SyntaxError：意外的令牌导出

0 个答案: