var
webpack = require(
"webpack"
);
var
ExtractTextPlugin = require(
"extract-text-webpack-plugin"
);
var
HtmlWebpackPlugin = require(
'html-webpack-plugin'
);
module.exports={
entry:{
"common"
: [__dirname+
"/src/page/common/common.js"
],
"index"
: [__dirname+
"/src/page/index/index.js"
],
"login"
: [__dirname+
"/src/page/login/login.js"
]
},
output:{
path:__dirname+
"/dist"
,
filename:
"/js/[name].js"
},
externals:{
"jquery"
:
"window.jQuery"
},
module : {
loaders : [
{
test: /\.css$/,
loader : ExtractTextPlugin.extract(
"style-loader"
,
"css-loader"
)
}
]
},
plugins : [
new
webpack.optimize.CommonsChunkPlugin({
name :
"common"
,
filename :
"/js/base.js"
,
}),
new
ExtractTextPlugin(
"/css/[name].css"
),
new
HtmlWebpackPlugin({
template :
"./src/view/index.html"
,
filename :
"/view/index.html"
,
inject :
true
,
hash :
true
,
chunks : [
"common"
,
"index"
]
})
]
};
<!DOCTYPE html>
<html>
<head>
<meta charset=
"utf-8"
>
<title>Webpack Sample Project</title>
<link href=
"../Users/Administrator/Desktop/happytmall/dist//css/index.css?2f06bba8cfc9aa7a6212"
rel=
"stylesheet"
></head>
<body>
<p id=
'root'
></p>
<script type=
"text/javascript"
src =
"https://cdn.bootcss.com/jquery/2.1.2/jquery.min.js"
></script>
<script type=
"text/javascript"
src=
"../Users/Administrator/Desktop/happytmall/dist//js/base.js?2f06bba8cfc9aa7a6212"
></script><script type=
"text/javascript"
src=
"../Users/Administrator/Desktop/happytmall/dist//js/index.js?2f06bba8cfc9aa7a6212"
></script></body>
</html>