1.下载安装html-webpack-plugin：
npm install html-webpack-plugin --save-dev
2.在webpack.config.js中
const path = require('path');
const webpack = require('webpack');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry:'./src/main.js',
output:{
path:path.resolve(__dirname,'dist'),
filename:'bundle.js',
// publicPath:'dist/'
},
plugins: [
// make sure to include the plugin for the magic
new VueLoaderPlugin(),
new webpack.BannerPlugin('最终版权归小马哥所有'),
new HtmlWebpackPlugin({
template:'index.html'
})
],
...
}index.html 如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<div id="app">
<!-- <h2>{{message}}</h2> -->
</div>
<body>
<!-- <script src="./dist/bundle.js"></script> -->
<!--webpack打包： webpack3： webpack a.js bundle.js-->
<!--webpack打包： webpack4： webpack a.js -o bundle.js --mode development-->
</body>
</html>