webpack打包jquery并引用
2021-06-15 15:03
标签：css 异步加载 man blog npm out filename app ide 一，引入webpack插件 二，要确定cnpm install jquery --save,之后在入口文件引入jquery； 三， 这么打包之后 这样，打包到dist下的vendor.js中的jquery就可以引用了。 webpack打包jquery并引用 标签：css 异步加载 man blog npm out filename app ide 原文地址：http://www.cnblogs.com/wang715100018066/p/7275282.html//打包第三方
const CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin");
module.exports = {
entry: {
app:PATHS.app,
vendor:[‘jquery‘]
// "jquery":[__dirname+‘plugins/jquery/jquery.min.js‘]
// "bootcss":path( __dirname + "/src/plugins/bootstrap-3.3.7/dist/css/bootstrap.css"),
},
}
plugins: [
//打包第三方
new CommonsChunkPlugin({
names: [‘vendor‘,‘manifest‘]//manifest:抽取变动部分，防止第三方控件的多次打包
// filename:"chunk.js"//忽略则以name为输出文件的名字，否则以此为输出文件名字
}),
]
jquery需要require才能用的，在入口的index.js中，//需要独立打包、异步加载的代码，使用require.ensure
require.ensure([‘jquery‘],function (require) {
var $ = require(‘jquery‘);
$(function(){
var w = $(".mwtsidebar").width()+1;
$(".side-sec-ul").css("left",w+"px");
$(".menu-triangle").css("top","204px");
$(".wrapper").mouseover(function () {
var h = $(this).height();
var of = $(this).offset().top;
var ofh = of+h/2;
$(".menu-triangle").css("top",ofh+"px");
$(this).find(".side-sec-ul").css(‘display‘,‘block‘);
}).mouseout(function () {
$(".menu-triangle").css("top","204px");
$(this).find(".side-sec-ul").css(‘display‘,‘none‘);
})
$(".nav>li").click(function () {
$("this").addClass("active");
})
});
});