Webpack 修改输出文件目录

Webpack 修改输出文件目录

const path = require('path'); // nodejs核心模块，专门用来处理路径的问题

module.exports = {
//入口
entry:"./src/main.js", 
//输出
output:{
  //所有文件的输出路径
  //__dirname nodejs的变量,代表当前文件的文件夹目录
  path:path.resolve(__dirname,"dist"), 
  //入口文件打包的文件名文件名
  filename:"static/js/main.js",    //js文件都放到js目录下
  //打包前将path整个目录内容清空，再进行打包
  clean:true
},
//加载器
module:{
  rules:[
	test:/\.(png|jpe?g|gif|webp|svg)$/, 
	type:"asset",    
	parse:{	
		dataUrlCondition:{		  
			//小于10kb的图片转base64
			//优点：减少请求数量 缺点：体积会更大
			maxSize: 10*1024
	  }
	},
	generator:{
	  //输出图片名称
	  //[hash:10]  表示hash值取前10位
	  filename:"static/images/[hash:10][ext][query]"   //图片放到images目录下
	}
  ],
},
//插件
plugins:[
   //plugin的配置
],
//模式
mode:"",
}