开发者学堂课程【前端自动化构建工具 Webpack：loader - 配置处理 css 样式表的第三方 loader】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/587/detail/8216
loader - 配置处理 css 样式表的第三方 loader
配置处理 css 样式的第三方 loader
1.去掉前面的样式点：先在 css 下面创建 index.css 文件
li{
list-style:none;
}
2.样式要生效必须要导入页面中，在 index.html 中用 link 标签导致 css 发起二次请求，不推荐这样写
//在main.js中使用import可以导入css样式表
import './css/index.css'
//一般js模块使用 import $ from,非 js 模块直接使用 import
保存会报错：你可能需要一个合适的 loader 去处理这种文件类型
所以 import 处理不了以 css 为后缀的文件
3.为什么 jquery 可以而 css 不可以？
注意：webpack 默认只能打包处理js类型文件，无法处理其他非 js 类型的文件
4.如果要处理非 js 类型文件我们需要手动安装一些合适第三方 loader 加载器；
点击终端
webpack：Failed tocompile.
终止此处处理操作吗（Y/N）？Y
ps C:\Users\liulongbin\Desktop\day5\代码\webpack-study>
5.使用 webpack 打包 css 文件
l 运行 cnpm i style-Loader css-loader -- save-dev
l 修改 webpack.confic-js 这个配置文件
module：{//这个节点用于配置所有第三方模块加载器
rules：[//所有第三方模块的匹配规则
{ test：/ \.css$/,use:[＇style-loader＇,＇css-loader＇]},//配置处理css文件的第三方loader规则
l 注意: use 表示使用哪些模块来处理 test 所匹配到的文件: use 中相关 loader 模块的调用顺序是从后向前调用的;
l 如果要打包处理 css 文件需要安装 cnpm i style-loader css-loder-D
l 打开 webpack.config.js 这个配置文件，在里面新增一个配置节点叫做 module，它是一个对象，在这个 module 对象身上有个 rules 属性，这个 rules 属性是个数组，这个数组中存放了所有第三方文件的匹配和处理规则。
6.打开webpack.config.js
plugins:[//配置插件的节点
],
module:{//这个节点用于配置所有的第三方模块加载器
rules：[//所有第三方模块的匹配规则
{text: /.\css$/,use:[＇style-loader＇,＇css-loader＇]}//用text匹配这种文件类型
]
}
再运行一次，点击终端
ps C:\Users\liulongbin\Desktop\day5\代码\webpack-study> npm run dev
