Javascript Webpack和Karma测试:未捕获引用错误:未使用定义jQuery

Javascript Webpack和Karma测试:未捕获引用错误:未使用定义jQuery,javascript,jquery,node.js,reactjs,karma-runner,Javascript,Jquery,Node.js,Reactjs,Karma Runner,我对这个图书馆有一个奇怪的问题。我已将我的网页设置为具有外部 externals: { jquery: 'jQuery' }, 当我运行npm测试时,这会导致一个错误,移除它可以让我的测试正确地运行业力。但是,如果我删除它,它就不允许我在APP.JSX中运行我的基础。 require('style!css!foundation-sites/dist/foundation.min.css') $('document').foundation(); //This is where

我对这个图书馆有一个奇怪的问题。我已将我的网页设置为具有外部

  externals: {
    jquery: 'jQuery'
  },
当我运行npm测试时,这会导致一个错误,移除它可以让我的测试正确地运行业力。但是,如果我删除它,它就不允许我在APP.JSX

中运行我的基础。
require('style!css!foundation-sites/dist/foundation.min.css')
$('document').foundation(); //This is where it errors
因此,如果删除jquery外部,在该点渲染时会出现错误。如果我添加外部jquery:'jquery'将破坏测试。任何人都知道如何修复它。jQuery是我的npm模块的一部分

npm install jquery --save
然后直接在模块中要求jquery:

var $ = require('jquery');
require('style!css!foundation-sites/dist/foundation.min.css');
$('document').foundation();

在尝试了很多东西并重写了配置文件之后,我也犯了同样的错误。我不知道为什么,但这是有效的

移除外部 将插件更改为:

  plugins: [
    new webpack.ProvidePlugin({
      'window.$': 'jquery',
      'window.jQuery': 'jquery'
    })
  ],
结果:

测试文件

var React = require('react');
var ReactDom = require('react-dom');
var expect = require('expect');
var $ = require('jquery');
var TestUtils = require('react-addons-test-utils');

var Clock = require('Clock');

describe('Clock', () => {
    it ('should exist', () => {
        expect(Clock).toExist();
    });
    describe('rebder', () => {
        it('should render clock to output', () => {
            var clock = TestUtils.renderIntoDocument(<Clock totalSeconds={62}/>);
            var $el = $(ReactDom.findDOMNode(clock));
            var actualText = $el.find('.clock-text').text();
            expect(actualText).toBe('01:02');
        });
    });
    describe('formatSeconds', () => {
        it('should format seconds', () => {
            var clock = TestUtils.renderIntoDocument(<Clock/>);
            var seconds = 615;
            var expected = '10:15';
            var actual = clock.formatSeconds(seconds);

        expect(actual).toBe(expected);
    });

    it('should format seconds when min/sec are less than 10', () => {
        var clock = TestUtils.renderIntoDocument(<Clock/>);
        var seconds = 61;
        var expected = '01:01';
        var actual = clock.formatSeconds(seconds);

        expect(actual).toBe(expected);
        });
    });
});
package.json

{
  "name": "TimerApp",
  "version": "1.0.0",
  "description": "Simple react app",
  "main": "index.js",
  "scripts": {
    "test": "karma start",
    "start": "node server.js"
  },
  "author": "Hyodo",
  "license": "MIT",
  "dependencies": {
    "axios": "^0.9.1",
    "express": "^4.13.4",
    "react": "^0.14.7",
    "react-dom": "^0.14.7",
    "react-router": "^2.0.0"
  },
  "devDependencies": {
    "babel-core": "^6.5.1",
    "babel-loader": "^6.2.2",
    "babel-preset-es2015": "^6.5.0",
    "babel-preset-react": "^6.5.0",
    "babel-preset-stage-0": "^6.5.0",
    "css-loader": "^0.23.1",
    "expect": "^1.14.0",
    "foundation-sites": "6.2.0",
    "jquery": "^2.2.1",
    "karma": "^0.13.22",
    "karma-chrome-launcher": "^0.2.2",
    "karma-mocha": "^0.2.2",
    "karma-mocha-reporter": "^2.0.0",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^1.7.0",
    "mocha": "^2.4.5",
    "node-sass": "^3.4.2",
    "react-addons-test-utils": "^0.14.6",
    "sass-loader": "^3.1.2",
    "script-loader": "^0.6.1",
    "style-loader": "^0.13.0",
    "webpack": "^1.12.13"
  }
}

希望这对你或其他人有帮助。我是在上完我的反应课程后遇到这个问题的。这是一个有点过时,但测试部分正是我所寻找的。问题是这种配置。

尝试了,它在$'文档'上捕获了一个错误。线
{
  "name": "TimerApp",
  "version": "1.0.0",
  "description": "Simple react app",
  "main": "index.js",
  "scripts": {
    "test": "karma start",
    "start": "node server.js"
  },
  "author": "Hyodo",
  "license": "MIT",
  "dependencies": {
    "axios": "^0.9.1",
    "express": "^4.13.4",
    "react": "^0.14.7",
    "react-dom": "^0.14.7",
    "react-router": "^2.0.0"
  },
  "devDependencies": {
    "babel-core": "^6.5.1",
    "babel-loader": "^6.2.2",
    "babel-preset-es2015": "^6.5.0",
    "babel-preset-react": "^6.5.0",
    "babel-preset-stage-0": "^6.5.0",
    "css-loader": "^0.23.1",
    "expect": "^1.14.0",
    "foundation-sites": "6.2.0",
    "jquery": "^2.2.1",
    "karma": "^0.13.22",
    "karma-chrome-launcher": "^0.2.2",
    "karma-mocha": "^0.2.2",
    "karma-mocha-reporter": "^2.0.0",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^1.7.0",
    "mocha": "^2.4.5",
    "node-sass": "^3.4.2",
    "react-addons-test-utils": "^0.14.6",
    "sass-loader": "^3.1.2",
    "script-loader": "^0.6.1",
    "style-loader": "^0.13.0",
    "webpack": "^1.12.13"
  }
}