Javascript 因果报应+；茉莉花罐头'；找不到需要的变量

我正在尝试使用karma和jasmine在我的VueJS项目中实现一些测试。我可以启动基本测试，例如：

describe('canary', function () {

  // asserting JavaScript options
  it('should run', function () {
    expect(true).toBe(true)
  })

  it('should run 2', function () {
    expect(false).toBe(false)
  })
})

哪种返回（我还不允许在我的帖子上显示图像）：

但当涉及到测试我的组件时（因此当我需要它们时），它对我说：

PhantomJS 2.1.1（Mac OS X 0.0.0）错误 ReferenceError:找不到变量：require 在history.spec.js:1

这是我的karma.conf.js：

module.exports = function(config) {
  var tests = './**/*.js';

  config.set({

    frameworks: ['jasmine'],

    files: [tests],

    reporters: ['dots'],

    singleRun: true,
    autoWatch: false,

    browsers: ['PhantomJS'],

    preprocessors: {
      tests: ['webpack'],
      '../src/main.js': ['webpack']
    },
     webpack: {
      module: {
        loaders: [
          { test: /\.js/, exclude: /node_modules/, loader: 'babel-loader' }
        ]
      },
      watch: true
    },
    webpackServer: {
      noInfo: true
    }
  });
};

这是我的测试文件：

var Vue = require('vue')
var ComponentA = require('../src/Log.vue')

describe('Log.vue', function () {

  // asserting JavaScript options
  it('should have correct message', function () {
    expect(ComponentA.data().msg).toBe('Hello from Log!')
  })
})

---

编辑-新的karma.conf.js文件

我设法让它工作，所以我在这里发布了我的配置文件，可能会有所帮助

webpack.test.config.js：

const path = require('path')

module.exports = {
  module: {
    loaders: [
      {
        test: /\.vue$/,
        loader: 'vue-loader'
      },
      {
        test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?.*$|$)/,
        loader: 'file-loader?name=assets/[name].[hash].[ext]'
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015']
        },
        include: [
          path.resolve(__dirname, '../')
        ],
        exclude: /node_modules/
      },
    ],
    rules: [
        {
          // Maybe just use vue-loader on html template files in components directory only 
          // Like /components\/.*\.html$/
          test: /\.vue$/,
          loader: 'vue-loader'
        },
        {
          test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?.*$|$)/,
          loader: 'file-loader?name=assets/[name].[hash].[ext]'
        },
    ]
  },
  resolve: {
    extensions: ['.js', '.vue']
  }
}

karma.conf.js

module.exports = function(config) {
  var tests = '*.js';

  config.set({

    frameworks: ['jasmine'],

    files: [tests],

    reporters: ['dots'],

    singleRun: true,
    autoWatch: false,

    browsers: ['PhantomJS'],

    preprocessors: {
      tests: ['webpack'],
      '../src/main.js': ['webpack']
    },
     webpack: {
      module: {
        loaders: [
          { test: /\.js/, exclude: /node_modules/, loader: 'babel-loader' }
        ]
      },
      watch: true
    },
    webpackServer: {
      noInfo: true
    }
  });
};

一些基本测试：

import { expect } from 'chai'

describe('canary', function () {

  // asserting JavaScript options
  it('should run', function () {
    expect(true).to.be.true
  })

  it('should run 2', function () {
    expect(false).to.be.false
  })
})

---

您正在使用

karma browserify

，但您已将预处理器设置为

webpack

，而不是

browserify

，有什么原因吗？是的，我后来看到了，我使用了我在网上看到的补丁，现在修复了它并将其移动到webpack，但这仍然不起作用。