add HtmlWebpackPlugin

This commit is contained in:
huixisheng 2017-03-01 13:56:01 +08:00
parent 1f561319f3
commit 5af94c5295
3 changed files with 15 additions and 6 deletions

View file

@ -5,6 +5,7 @@
var path = require('path'); var path = require('path');
var webpack = require('webpack'); var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin'); var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
// 入口 // 入口
@ -15,7 +16,7 @@ module.exports = {
// 输出 // 输出
output: { output: {
path: path.join(__dirname, '../test/dist'), path: path.join(__dirname, '../test/dist'),
publicPath: '/test/dist/', publicPath: '',
filename: '[name].js', filename: '[name].js',
chunkFilename: '[name].chunk.js' chunkFilename: '[name].chunk.js'
}, },
@ -99,8 +100,15 @@ module.exports = {
} }
}, },
plugins: [ plugins: [
new ExtractTextPlugin({ filename: '[name].css', disable: false, allChunks: true }), // 提取CSS // new ExtractTextPlugin({ filename: '[name].css', disable: false, allChunks: true }),
// new ExtractTextPlugin("[name].css",{ allChunks : true,resolve : ['modules'] }), // 提取CSS
// https://doc.webpack-china.org/plugins/commons-chunk-plugin/ // https://doc.webpack-china.org/plugins/commons-chunk-plugin/
new webpack.optimize.CommonsChunkPlugin({ name: 'vendors', filename: 'vendor.js' }) new webpack.optimize.CommonsChunkPlugin({ name: 'vendors', filename: 'vendor.bundle.js' }),
new HtmlWebpackPlugin({
inject: true,
filename: path.join(__dirname, '../test/dist/index.html'),
template: path.join(__dirname, '../test/index.html') // 模版文件
})
// new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js'), // 提取第三方库
] ]
}; };

View file

@ -65,6 +65,7 @@
"gulp-less": "^3.1.0", "gulp-less": "^3.1.0",
"gulp-rename": "^1.2.2", "gulp-rename": "^1.2.2",
"html-loader": "^0.3.0", "html-loader": "^0.3.0",
"html-webpack-plugin": "^2.28.0",
"less": "^2.7.1", "less": "^2.7.1",
"less-loader": "^2.2.3", "less-loader": "^2.2.3",
"style-loader": "^0.13.1", "style-loader": "^0.13.1",

View file

@ -3,11 +3,11 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>iView test page</title> <title>iView test page</title>
<link href="/test/dist/main.css" rel="stylesheet"> <!-- <link href="/test/dist/main.css" rel="stylesheet"> -->
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<script type="text/javascript" src="/test/dist/vendors.js"></script> <!-- <script type="text/javascript" src="/test/dist/vendor.js"></script>
<script type="text/javascript" src="/test/dist/main.js"></script> <script type="text/javascript" src="/test/dist/main.js"></script> -->
</body> </body>
</html> </html>