什么是loader、项目中安装loader、使用loader管理css格式文件

1、什么是loader?

可以加载和使用项目中的css文件

https://www.webpackjs.com/concepts/loaders/

1.1、css文件处理-准备工作

1.2、css文件处理介绍：css-loader

1.3、css文件处理介绍：style-loader

1.4、在项目中安装样式的loader

webpack中文网站样式的loader参考

在终端中使用以下命令安装

npm install --save-dev css-loader@2.0.2
npm install --save-dev style-loader@0.23.1

package.json中控制loader版本
在webpack.config.js中查看，安装成功

1.5、案例：如何在项目中使用loader管理css样式文件

1、首先新建css文件normal.css

body {
  background-color: aqua;
}

2、main.js中引入该css文件

3、打开vscode终端，安装loder
注意loader版本号

npm install --save-dev css-loader@2.0.2
npm install --save-dev style-loader@0.23.1

4、下载成功

5、配置
css-loader负责加载样式、style-loader负责使用样式

6、使用命令打包

npm run build

7、浏览器访问index.html

css样式引入成功