webpack 配置注意的小技巧和坑

最新推荐文章于 2025-11-13 16:00:22 发布

原创

最新推荐文章于 2025-11-13 16:00:22 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#webpack #前端

本文介绍了webpack配置中的几个关键点，包括css-loader的使用注意事项，如何设置context以影响entry的相对路径，resolve.extensions的配置以简化文件导入，以及如何通过alias优化模块导入。同时，文章还提到了在React项目中配置TypeScript和处理图片导入的问题，特别是解决TS文件中导入图片的错误。

webpack 配置注意的小技巧和坑

// 相关版本信息
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12"

css-loader 中的坑

自 v1.0.0 开始废弃了 minimize option，因此无法由如下的写法 v1.0.0 break changes

// ... 省略其余配置内容
module:{
   
   
	rules:[
		// "css-loader?minimize",  error
		{
   
    
			test: /\.css$/, 
			use:[ 
				loader:'css-loader',
				options:{
   
    minimize: true } // error
			]<