Webpack给出$未定义或者jQuery未在控制台中定义错误

时间:2017-02-11 05:56:09

标签: javascript webpack

嘿伙计们我尝试了一切,我准备好羞愧地爆发,我厌倦了在过去的4个小时里一遍又一遍地犯同样的错误。我只是要复制并粘贴控制台,以便我们可以看到它有多糟糕:

Uncaught Error: Bootstrap's JavaScript requires jQuery
    at bootstrap.min.js:6
(anonymous) @ bootstrap.min.js:6
etw.js:4 Fri Feb 10 2017
etw.js:125 Uncaught ReferenceError: $ is not defined
    at LFDTrack (etw.js:125)
    at Object.LFD_Search (etw.js:244)
    at User.lfd_search (etw.js:25)
    at etw.js:250
LFDTrack @ etw.js:125
LFD_Search @ etw.js:244
User.lfd_search @ etw.js:25
(anonymous) @ etw.js:250
jBox.min.js:2 Uncaught ReferenceError: jQuery is not defined
    at jBox.min.js:2
(anonymous) @ jBox.min.js:2
jquery.datetimepicker.full.min.js:1Uncaught ReferenceError: jQuery is not defined
    at jquery.datetimepicker.full.min.js:1
    at jquery.datetimepicker.full.min.js:1
(anonymous) @ jquery.datetimepicker.full.min.js:1
(anonymous) @ jquery.datetimepicker.full.min.js:1
owl.carousel.js:1517 Uncaught ReferenceError: jQuery is not defined
    at owl.carousel.js:1517
(anonymous) @ owl.carousel.js:1517
(index):539 Uncaught ReferenceError: $ is not defined
    at (index):539
(anonymous) @ (index):539
featherlight.min.js:8 Uncaught ReferenceError: jQuery is not defined
    at featherlight.min.js:8
(anonymous) @ featherlight.min.js:8
jquery.datetimepicker.full.min.js:1 Uncaught ReferenceError: jQuery is not defined
    at jquery.datetimepicker.full.min.js:1
    at jquery.datetimepicker.full.min.js:1
(anonymous) @ jquery.datetimepicker.full.min.js:1
(anonymous) @ jquery.datetimepicker.full.min.js:1
pagecrossfade-min.js:1 Uncaught ReferenceError: jQuery is not defined
    at pagecrossfade-min.js:1

这是我的main.js文件,条目:

"use strict";

import $ from 'jquery';
import jQuery from 'jquery';
window.$ = jQuery;
import moment from 'moment';
import _ from 'lodash';
import math from 'mathjs';
//import jBox from 'jbox';

这是我的webpack.config.js 我尝试过切换一切。 a.k.a取出加载器部分并将插件部分留在那里,或者取出main.js中的导入,只留下webpack.config.js中的东西用于jquery等等。没有任何作用。我觉得我是网络上唯一一个仍然有这个错误的人,因为其他所有人都已经修好了所以我再也找不到谷歌搜索了。(ps我不知道除了日期时间选择器和其他什么之外什么都不做控制台中的脚本是指向html文件中的cdn的脚本标记)

const path = require('path');
const webpack = require('webpack');

module.exports = {
    entry: './main.js',
    output: { path: __dirname, filename: 'bundle.js' },
    watch: true,
    plugins: [
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery"
        })
    ],
    module: {
        loaders: [
            {
                test: /[\/\\]node_modules[\/\\]some-module[\/\\]index\.js$/,
                loader: "imports?this=>window"
            },
            {
                test: /[\/\\]node_modules[\/\\]some-module[\/\\]index\.js$/,
                loader: "imports?define=>false"
            }
    ]
    }
}

1 个答案:

答案 0 :(得分:0)

我遇到了同样的问题。

我的错误是:

Uncaught ReferenceError: jQuery is not defined
    at eval (featherlight.min.js?60bc:8)
    at Object../node_modules/featherlight/release/featherlight.min.js 

您的问题实际上为我提供了解决的提示。

const $ = require("jquery");
window.jQuery = $;    //When I added this line, it worked!
require('featherlight');