Javascript webpackJsonp未使用karma webpack定义?

Javascript webpackJsonp未使用karma webpack定义?,javascript,karma-runner,webpack,karma-mocha,Javascript,Karma Runner,Webpack,Karma Mocha,我正在用网页包和摩卡咖啡制作一个样板 这是我用于karma网页包的配置。我是新来的网页包 var path = require('path'); var webpack = require('webpack'); var entries = { "app": ["./index.js"] }; var root = './'; var testSrc = path.join(root, 'tests/'); var jsSrc

我正在用网页包和摩卡咖啡制作一个样板

这是我用于karma网页包的配置。我是新来的网页包

var path          = require('path');
var webpack = require('webpack');
var entries =  {
  "app": ["./index.js"]
};
var root            = './';
var testSrc         = path.join(root, 'tests/');
var jsSrc           = path.join(root, 'src/javascripts/');
var publicPath      = path.join(root , 'public/');
var filenamePattern = 'index.js';
var extensions      = ['js'].map(function(extension) {
  return '.' + extension;
});


var webpackConfig = {
  context: jsSrc,
  resolve: {
    root: jsSrc,
    extensions: [''].concat(extensions)
  },
  resolveLoader: {
    root: path.join(__dirname, "node_modules")
  },
  module: {
    loaders: [{
      test: /\.js$/,
      loader: 'babel-loader',
      exclude: /node_modules/
    }]
  },
  entry: entries,
  output: {
    filename: filenamePattern,
    publicPath: publicPath
  },
  plugins: [new webpack.optimize.CommonsChunkPlugin({
    name: 'shared',
    filename: filenamePattern,
  })]
};

var karmaConfig = {
  frameworks: ['mocha'],
  files: ['tests/test-index.js'],
  preprocessors: {
    'tests/**/*.js': ['webpack']
  },
  webpack: webpackConfig,
  webpackMiddleware: {
    noInfo: true,
  },
  singleRun: false,
  autoWatch: true,
  colors: true,
  reporters: ['nyan'],
  browsers: ['Chrome'],
  plugins: [
    require("karma-nyan-reporter"),
    require("karma-mocha"),
    require("karma-firefox-launcher"),
    require("karma-webpack"),
    require("karma-chrome-launcher")
  ]
};
module.exports = function(config) {
  config.set(karmaConfig);
};

当我运行karma start karma.local.conf.js时,它不会执行测试,因为它在浏览器webpackJsonp中说没有定义。我想知道我是否在这个配置中遗漏了什么。

在对这个问题发生的原因或方式进行了一些研究之后,我发现有一个web pack插件正在与karma发生冲突

因此,配置结果将是:

var path          = require('path');
var webpack = require('webpack');
var entries =  {
  "app": ["./index.js"]
};
var root            = './';
var testSrc         = path.join(root, 'tests/');
var jsSrc           = path.join(root, 'src/javascripts/');
var publicPath      = path.join(root , 'public/');
var filenamePattern = 'index.js';
var extensions      = ['js'].map(function(extension) {
  return '.' + extension;
});


var webpackConfig = {
  context: jsSrc,
  resolve: {
    root: jsSrc,
    extensions: [''].concat(extensions)
  },
  resolveLoader: {
    root: path.join(__dirname, "node_modules")
  },
  module: {
    loaders: [{
      test: /\.js$/,
      loader: 'babel-loader',
      exclude: /node_modules/
    }]
  },
  entry: entries,
  output: {
    filename: filenamePattern,
    publicPath: publicPath
  }
};

var karmaConfig = {
  frameworks: ['mocha'],
  files: ['tests/test-index.js'],
  preprocessors: {
    'tests/**/*.js': ['webpack']
  },
  webpack: webpackConfig,
  webpackMiddleware: {
    noInfo: true,
  },
  singleRun: false,
  autoWatch: true,
  colors: true,
  reporters: ['nyan'],
  browsers: ['Chrome'],
  plugins: [
    require("karma-nyan-reporter"),
    require("karma-mocha"),
    require("karma-firefox-launcher"),
    require("karma-webpack"),
    require("karma-chrome-launcher")
  ]
};
module.exports = function(config) {
  config.set(karmaConfig);
};
所以我删除了网页包插件。这里是对这个问题的另一个参考


您可以通过更改加载到Karma浏览器的文件顺序来解决此问题

karma.conf.js

files: [
            'build/shared.js',
            'build/**/*.js',
        ]
Shared(在我的例子中)是定义“webpackJsonp”的文件。
通过将这个放在文件的顶部,它将在其他js文件之前加载。正在解决错误。

我在基于Asp.Net MVC 5的web应用程序的浏览器中也遇到了相同的问题:

"webpackJsonp is not defined"
虽然我没有使用因果报应。我找到的解决方案是将commons块文件移动到普通的基于脚本标记的包含中。我之前是通过Asp.NETMVC的bundling
BundleConfig.cs
文件加载这个文件的。我猜有时候不知什么原因,这个commons块文件会在我的其他模块文件之后加载,从而引起浏览器的抱怨

我从
BundleConfig.cs
中删除了commons.chunk.js包含项,并使用普通脚本标记将其添加到页面中,就在我的bundle类之前:

<script type="text/javascript" src="@Url.Content("~/Scripts/build/commons.chunk.js")"></script>
@Scripts.Render("~/bundles/myModules")

@Scripts.Render(“~/bundles/myModules”)

您有我可以看到这个案例的回购协议吗?很抱歉,我很快创建了一个在github上的回购协议,没有任何效果,但显示了实际问题。如果您运行“gulp test”=>找不到可变jsonp,请在karma.conf中注释掉文件,然后再次运行,您将看到错误消失。(错误会出现,因为没有正确的设置)只是演示目的没有问题,如果你有一个解决这个问题的方法,如果没有任何错误,那就太好了,这样你就可以揭示你的发现,我已经在github问题报告中回答过了,可能是可以关闭XD。