Jquery 网页包ES6模块-fancyBox/tagsInput不是函数库导入
我正在尝试加载一些库,fancyBox和tagsInput,它们都依赖于Jquery,加载到我的Web包绑定的es6模块中 在myFile.js中,我有以下内容Jquery 网页包ES6模块-fancyBox/tagsInput不是函数库导入,jquery,ecmascript-6,webpack,Jquery,Ecmascript 6,Webpack,我正在尝试加载一些库,fancyBox和tagsInput,它们都依赖于Jquery,加载到我的Web包绑定的es6模块中 在myFile.js中,我有以下内容 import $ from 'jquery'; import './../..vendor/jquery.fancybox.js'; 我的文件结构如下 /node_modules /frontend index.js /components /myFolder myFile.js
import $ from 'jquery';
import './../..vendor/jquery.fancybox.js';
我的文件结构如下
/node_modules
/frontend
index.js
/components
/myFolder
myFile.js
/vendor
jquery.fancybox.js
但是,我得到了以下错误
Uncaught TypeError: (0 , _jquery2.default)(...).fancybox is not a function
那么fancybox似乎无法将自身连接到jquery对象?我正试图通过在我下面的网页配置中使用导入加载器来纠正这个问题
const webpack = require('webpack');
const path = require('path');
const precss = require('precss');
const autoprefixer = require('autoprefixer');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const postcssImport = require('postcss-import');
module.exports = {
context: __dirname + '/frontend',
devtool: 'source-map',
entry: {
app: './index.js',
},
output: {
filename: 'bundle.js',
path: path.join(__dirname, './static'),
},
module: {
loaders: [
{ test: /\.js$/, loader: 'babel', exclude: /node_modules/, query: { presets: ['es2015'] } },
{ test: /\.css$/, loader: ExtractTextPlugin.extract('style', 'css?sourceMap&importLoaders=1!postcss') },
{ test: /[\/\\]node_modules[\/\\]some-module[\/\\]index\.js$/, loader: 'imports?this=>window' },
{ test: /vendor\/.+\.(jsx|js)$/, loader: 'imports?jQuery=jquery,$=jquery,this=>window' },
],
},
plugins: [
new ExtractTextPlugin('si-styles.css'),
],
postcss: function(webpack) {
return [
postcssImport({ addDependencyTo: webpack }), // Must be first item in list
precss,
autoprefixer({ browsers: ['last 2 versions'] }),
];
},
};
如果您对此有任何想法,我们将不胜感激。在我的webpack.config.js中使用webpack.ProvidePlugin提供jquery,并且从我的文件中删除“import jquery”似乎已经解决了这一问题
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
})
在我的webpack.config.js中使用webpack.providerlugin提供jquery,并从myFile中删除“import jquery”似乎已经修复了这一点。新的webpack.ProvidePlugin({$:“jquery”,jquery:“jquery”,})