less安装与配置

比眉伴天荒 2023-01-19 03:10 33阅读 0赞

之前配置项目的时候也有这些坑，所以今天配置新项目的时候顺便记录一下。  
新建项目后安装less

npm install less less-loader --save

安装成功后找到webpack.base.conf.js文件，在以下位置增加less配置支持

module: { 
        rules: [
        	{ }...........
        	//以上部分为项目配置后自带的，只需要在尾部添加即可
        	{ 
           		test: /\.less$/,
            	loader: "style-loader!css-loader!less-loader",
         	}
        ]
    }

默认安装的less版本较高  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ0NzY4NTY0_size_16_color_FFFFFF_t_70]  
可能会报以下错误  
TypeError: this.getOptions is not a function等…  
![在这里插入图片描述][20210507113130327.png]  
不慌，卸载重装就是了

npm uninstall less-loader

npm install less-loader@5.0.0

重新运行项目就ok了

> 配置项目在浏览器运行的小图标

//在index.html引入
    <link rel ="shortcut icon" type="image/x-icon" href="./favicon.ico">

//在webpack.base.conf.js添加如下配置
    plugins: [
        new HtmlWebpackPlugin({ 
            filename: 'index.html',
            template: 'index.html',
            favicon: 'favicon.ico'
        })
     ],

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ0NzY4NTY0_size_16_color_FFFFFF_t_70]: /images/20221021/309f204c1ac546d0b7f447e0d1d95b10.png
[20210507113130327.png]: /images/20221021/5596e9ba16134e6c801a13a99f778b73.png

发表评论取消回复

表情：

评论列表（有 0 条评论，33人围观）

还没有评论，来说两句吧...

相关阅读

相关 less安装与配置

之前配置项目的时候也有这些坑，所以今天配置新项目的时候顺便记录一下。新建项目后安装less npm install less less-loader --sav

比眉伴天荒/ 2023年01月19日 03:10/ 0 赞/ 34 阅读

相关 less的配置安装及语法使用

Less为什么会出现？ css(层叠样式表)是一门标记性语言，html和css不是编程语言，没有变量，函数，作用域等概念。语法简单，但是看起来非常的繁琐没有逻辑，而且很多

淩亂°似流年/ 2022年12月29日 00:30/ 0 赞/ 363 阅读

相关 react配置less

我使用的是customize-cra重写配置 config-overrides.js const { override,fixBabelImports,ad

骑猪看日落/ 2022年10月17日 04:20/ 0 赞/ 215 阅读

相关 less安装

官网地址：[https://less.bootcss.com/\%E6%A6%82%E8%A7%88][https_less.bootcss.com_E6_A6_82_E8_A

素颜马尾好姑娘i/ 2022年10月08日 15:23/ 0 赞/ 182 阅读

相关 less笔记-Less安装与基础使用

一、安装Less npm为Node.js的包管理器，通过npm可简易的安装Less。 Node.js下载地址：https://nodejs.org/en/ 下载的Node

布满荆棘的人生/ 2022年09月25日 13:21/ 0 赞/ 268 阅读

相关【vue】less配置图片

less配置图片参考文章：[https://blog.csdn.net/qq\_39695266/article/details/107693890][https_bl

Myth丶恋晨/ 2022年09月04日 10:55/ 0 赞/ 163 阅读

相关安装less环境

LESS 是动态的样式表语言，它能让CSS 的工作变得非常简单。安装过程如下：安装有两种方法安装：第一种是找到：C盘/-----------Users----

曾经终败给现在/ 2021年11月29日 23:44/ 0 赞/ 394 阅读

相关安装less/sass

安装sass npm i node-sass 安装wepy-compiler-sass插件 npm install wepy-compiler-sass

冷不防/ 2021年09月19日 10:34/ 0 赞/ 423 阅读

相关 idea 配置less编译包括less函数（less-plugin-functions）

首先需要安装 Node.js 依次安装使用 \`yarn\` 或者 \`npm\`均可 yarn global add less@2.7.2

谁借莪１个温暖的怀抱￠/ 2021年09月16日 15:08/ 0 赞/ 523 阅读

相关 react 配置less

1、下载 cnpm install --save less less-loader 2、在node-modules/react-scrip

左手的ㄟ右手/ 2021年07月25日 00:20/ 0 赞/ 336 阅读