【Vue CLI】二、Vue-cli3版本中如何修改打包好的css、js、img文件名
话不多说上代码。我用的是vueCli3.x,所有的修改全在vue.config.js中:const MiniCssExtractPlugin = require('mini-css-extract-plugin');const conf = require('./conf/projectConfig');module.exports = {// 修改打包后js文件名configureWebpack
·
话不多说上代码。我用的是vueCli3.x,所有的修改全在vue.config.js中:
const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const conf = require('./conf/projectConfig'); module.exports = { // 修改打包后js文件名 configureWebpack: { // webpack 配置 output: { // 输出重构 打包编译后的 文件名称 【模块名称.版本号.js】 filename: `js/[name].${conf.version}.js`, // chunkFilename: `js/[name].${conf.version}.js` }, // 修改打包后css文件名 plugins: [ new MiniCssExtractPlugin({ filename: `css/[name].${conf.version}.css`, // chunkFilename: `css/[name].${conf.version}.css` }) ] }, // 修改打包后img文件名 chainWebpack: config => { config.module .rule('images') .use('url-loader') .tap(options => { return { limit: 4096, fallback: { loader: 'file-loader', options: { name: `img/[name].${conf.version}.[ext]` } } }; }) } }
看到没 css,js,img文件名的修改用三种完全不同的方式,每种方式都耗去我几个小时的时间。
有个问题就是生成的js、css确实有了带版本号的文件,但同时也多出来了带哈希文件名的文件
更多推荐
已为社区贡献2条内容
所有评论(0)