使用webpack 2加载jQuery插件 [英] Loading jQuery plugins with webpack 2
问题描述
花了一天的大部分时间进行谷歌搜索和尝试-我没有使它工作,现在我不确定丢失了什么.
我已经在webpack.common.js中使jQuery工作(并验证了它的工作原理):
After spending most of the day googling and trying - i did not get it to work and at this point i'm not sure what's missing.
I already have jQuery working (and verified it works) in webpack.common.js:
new ProvidePlugin({
jQuery: 'jquery',
$: 'jquery',
jquery: 'jquery'
})
例如,我有一个"MetisMenu"插件,该在哪里配置?
For example i have a "MetisMenu" plugin, where should i configure it?
我在app.module.ts中尝试了require/include
的各种组合.
像(包括将它们分配给常量/var,但导入/要求总是会出现此错误):
I tried various combinations of require/include
in my app.module.ts.
Like (including assigning them to a constant/var but import/require always give this error):
import 'metismenu';
jQuery(...).metisMenu is not a function
import { metisMenu } from 'metismenu';
Cannot assign to read only property 'exports' of object '#<Object>'
require ('metismenu');
Cannot assign to read only property 'exports' of object '#<Object>'
import * as jQuery from 'jquery';
import "metismenu";
Cannot assign to read only property 'exports' of object '#<Object>'
推荐答案
类似于webpack.ProvidePlugin使声明的全局变量在Webpack 2中不可变.
Looks like webpack.ProvidePlugin makes somehow declared globals immutable in Webpack 2.
我无法从模块中修改jQuery,然后在另一个模块上使用经过修改的jQuery(为此,添加了一个jQuery插件,并添加了自己的$ .fn.).
I was unable to modify jQuery from a module and then use the modified jQuery on the other (hear by that, adding a jQuery plugin that add its own $.fn.).
我建议您创建一个包含必需的jQuery插件"requires"的定义,它对我有用,例如:
I suggest you to create a single define that contains the necessary jQuery plugins "requires", it worked for me, e.g.:
((root, factory) => {
// AMD. Register as an anonymous module.
define([
'modernizr'
], factory);
})(this, (Modernizr) => {
// Do the requires here instead of doing it on the main file
// Fix broken $.animate so Slick can work with
require('./animatePolyfill');
// Inject carousel there
require('slick-carousel');
class Core extends PluginBase {
...
这篇关于使用webpack 2加载jQuery插件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!