loader - 配置处理 less 文件的 loader| 学习笔记

开发者学堂课程【前端自动化构建工具 Webpack：loader - 配置处理 less文件的loader】学习笔记，与课程紧密联系，让用户快速学习知识。

课程地址：https://developer.aliyun.com/learning/course/587/detail/8218

loader - 配置处理 less 文件的 loader

配置处理 less 文件的 loader

1.创建index.less，在index.less中

ul{

padding：0；

margin：0；

}


2.在main.js中导入

import＇./css/index.less＇

报错，需要一个合适的loader

3.点击终端

ps C:\Users\liulongbin\Desktop\day5\代码\webpack-study> npm i less-loader

ps C:\Users\liulongbin\Desktop\day5\代码\webpack-study> npm i less-D并不需要把less定义到webpack.config中去，只需要装less

4.新建一个规则：

{ test：/ \.less$/,use:[＇style-loader＇,＇css-loader＇，＇less-loader＇]}//配置处理less文件的第三方loader规则

5.重新启动

ps C:\Users\liulongbin\Desktop\day5\代码\webpack-study> npm run dev