wepack自身只能处理js和json文件,加上loader后,能让wepack去处理非js(css)的文件。loader可以将所有类型的文件转换为webpack能够处理的有效模块。

1. 安装依赖

cnpm i style-loader css-loader -S

2. 新建 assets->index.css

div{
    width: 100px;
    height: 100px;
    background-color: red;
}

//index.html
<div>html</div>

//main.js
import './assets/index.css'

//webpack.config.js
   module:{
        rules:[
            {
                test:/\.css$/i,
                use:['style-loader','css-loader']
            }
        ]
    },