在项目中,因为需要经常更新文件,但是浏览器缓存问题导致js文件不是最新的,所有想办法添加hash值。
并配置webpack打包文件配置路径:
配置webpack打包文件路径,及非入口 chunk文件:
entry: './src/main.js', output: { path: path.resolve(__dirname, './dist/assets'), //打包的文件路径 publicPath: 'assets/', //此输出目录对应的公开 URL 需要以 / 结尾 filename: 'build-[hash].js', //此选项决定了每个输出 bundle 的名称 使用参数:例:filename: "[name].[hash].[id].bundle.js" chunkFilename: '[id].build-[hash].js' //此选项决定了非入口(non-entry) chunk 文件的名称 },
配置 html-webpack-plugin 生成模板文件:
首先需要下载:cnpm install html-webpack-plugin --save-dev
引入:const HtmlWebpackPlugin = require('html-webpack-plugin')
使用:
plugins: [ new HtmlWebpackPlugin({ template: 'index.html', filename: '../index.html' }) ],
更多详细用法,可以参看这篇文章:https://segmentfault.com/a/1190000007294861