当前位置 博文首页 > 小丞同学：Webpack打包CSS文件
逛遍CSDN没有能让我打包成功的博文，然后理解了一波网上的讲解成功了！
创建入口文件，引入样式资源
创建一个index.js，和index.css文件当然这个文件名你可以自己起
在index.js文件中引入css
import './index.css'
配置webpack.config.js文件
注意：这个文件是自己新建的
配置内容
这里有些要注意的地方
entry是入口文件的路径，要按自己的路径填，不能直接复制我的
output是输出文件的文件名，和输出到什么位置，__dirname是用来动态获取当前文件所属目录的绝对路径，后面的build是我的一个文件夹，这个你们填自己的就好
const { resolve } = require('path');
module.exports = {
entry: './src/index.js', //这是入口文件的相对路径，按照你自己的写
output : {
filename: 'ind.js',//这个是打包好之后的文件名
path: resolve(__dirname,'build')//打包好后输出到哪个文件
},
module: {
rules :[
{
test:/\.css$/,
use:[
'style-loader',
'css-loader'
]
}
]
},//这个是相关的配置 直接复制就好
plugins:[
],//注意要加s
mode: 'development',//这里选择的是开发模式，选生产模式也可以
}
下包
npm init
然后这里要填写一些信息，回车就好
npm i webpack webpack-cli -D
css-loader style-loadernpm i css-loader style-loader -D
下包完成
打包
直接在终端输入webpack就可以了，到你在第二步填写的输出文件夹，就可以看到输出的文件了
至此，大功告成！！！
这是我的文件目录，可以参考一下
cs有什么问题可以私信或评论区讨论吧！！！
