html引入css webpack_HTML+CSS入门 webpack配置：CSS文件打包

本篇教程介绍了HTML+CSS入门 webpack配置：CSS文件打包，希望阅读本篇文章以后大家有所收获，帮助大家HTML+CSS入门。

<

1、在src下新建css文件，在css文件下新建index.css文件，输入以下代码

body{

color:red;

font-size:20px;

}

2、css建立好后，需要引入到入口文件，这里我们引入到index.js中

import css from ‘./css/index.css‘;

document.write("It works.");

3、在终端安装style-loader和css-loader

4、安装好后，我们开始在webpack.config.js中配置module选项

//模块：例如解读CSS,图片如何转换，压缩

module:{

rules:[

{

test:/\.css$/,

use:[‘style-loader‘,‘css-loader‘]

}

]

},

5、在终端输入 npm run server，可以看到出来的效果有了样式。

本文由职坐标整理发布，欢迎关注职坐标WEB前端HTML/CSS频道，获取更多HTML/CSS知识！