美文网首页
webpack引入jquery和layer插件

webpack引入jquery和layer插件

作者: Bestan | 来源:发表于2017-07-27 18:42 被阅读0次

前言:node.js和webpack的安装和配置,就不介绍了。这里引用一个webpack+react的项目,来讲解webpack引入jquery和layer.js。

1、下载layer插件,包括layer.css和layer.js。

        下载地址:layer.js官网

2、npm安装jquery。

         安装命令:npm install --save-dev jquery

3、修改webpack的配置文件webpack.config.js

webpack.config.js

           3.1、下图所示:webpack在构建包的时候会按目录的进行文件的查找,resolve属性中alias可以设置通过变量名引入插件(文件)。一个变量代表一个模块。如:layer: __dirname + '/assets/js/layer.js'。这样使用插件时,可以通过import layer from 'layer'引入。

引入layer

           3.2、下图所示:在webpack中添加插件ProvidePlugin,引入已经通过npm安装的jquery。

引入jquery

4、下图所示:页面调用

调用layer

5.效果图

6、常见错误

        6.1、一般是layer.css写法有问题,粗暴点注释掉即可。可参考fly.layui.com/jie/5884/

         6.2、有网友列出几种webpack引入插件的方法,可以参考参考。blog.csdn.net/yiifaa/article/details/51916560

第一次下笔记,有点乱==

相关文章

网友评论

      本文标题:webpack引入jquery和layer插件

      本文链接:https://www.haomeiwen.com/subject/ivftlxtx.html