使用Webpack处理CSS文件

本文介绍了如何使用Webpack处理CSS文件,包括安装和配置css-loader和style-loader,解决Webpack处理非js文件的问题。当不希望内联样式时,通过引入mini-css-extract-plugin插件,实现将CSS抽取到单独文件中。
摘要由CSDN通过智能技术生成

        同前几篇文章一样,首先需要在自己的项目目录下初始化自己的npm(命令:npm init),然后下载依赖的包(npm install webpack webpack-cli)

初始化完成后,创建配置文件(webpack.config.js),轻车熟路了哈

好了,让我们run以下试试:

 这时候可以看到报错了,说的是您需要一个loader处理该类型文件,这时候就联想到之前说的:loader是处理非js文件的。所以我们需要下载loader的包。这里需要下载css-loader(npm install --save-dev css-loader)。然后在webpack.config.js中配置loader:

 成功了,

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值