[英]jQuery loaded with ProvidePlugin in Webpack 2 does't work after route change
I am working in Angular4 and I am using Webpack setup for building the app. 我在Angular4中工作,正在使用Webpack设置来构建应用程序。 I want to use jQuery in my project so I googled it and found about the
ProviderPlugin
that is offered by Webpack to globally load modules. 我想使用jQuery在我的项目,所以我用Google搜索了一下,发现有关
ProviderPlugin
由的WebPack提供给全局负载模块。
However, the issue I am facing is a bit strange; 但是,我面临的问题有点奇怪。 the first time when the page loads the page works fine and all the code which is associated with jQuery works fine but when I change the page or route the jQuery loses its functionality and consequent pages don't work as expected.
第一次在页面加载时页面正常运行,并且与jQuery相关的所有代码均正常运行,但是当我更改页面或路由时,jQuery失去了功能,因此页面无法正常运行。 Am I missing something, the code I used for plugin is standard
我是否缺少某些东西,我用于插件的代码是标准的
new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' })
I am looking for other solutions as well, if there are other ways to do then please mention it would be a great help. 我也在寻找其他解决方案,如果还有其他方法可以解决,请提及这将是非常有用的。
Thank you so much. 非常感谢。
Also you can use the HtmlWebpackPlugin that will create your html pages. 您也可以使用HtmlWebpackPlugin创建HTML页面。 And set inject:true.
并设置inject:true。 Because you issue probably is when you try to access to another page the jquery isn't declared, so you need a main template page that has jquery and from this template, create the next html pages.
因为您的问题可能是当您尝试访问另一个页面时未声明jquery,所以您需要一个具有jquery的主模板页面,然后从该模板创建下一个html页面。 Example bellow:
下面是示例:
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true
})
So download the package in npm, configure, install it then set up. 因此,请在npm中下载该软件包,进行配置,安装并进行设置。
Also you can edit you jquery insertion with this: 您也可以使用以下命令编辑您的jquery插入:
new webpack.ProvidePlugin({
$: 'jquery',
jquery: 'jquery',
'window.jQuery': 'jquery',
jQuery: 'jquery'
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.