nextjs12支持less
配置可行的方法:
方法2:
1)安装依赖

npm install next-plugin-antd-less

2)在next.config.js中加配置

const withAntdLess = require('next-plugin-antd-less');module.exports = withAntdLess({
});

优点: 1)这个方法是在方法1之后执行的,此方法中一开始就可以支持less样式文件的导入,但是样式不生效。其他的几种方法里面,less文件导入之后,运行就会报错,报没有less loader这种问题,在安装依赖的时候,这些都已经安装过,也没有找到解决这类问题的方案。(为什么选这个方法)
2)进行环境还原之后即可成功配置less
缺点: 1) less文件不生效的原因我排查到是环境不干净,依赖之间可能有影响。环境不干净等问题是没有提示的,需要自行去排查并解决。因为我在翻阅了帖子之后会对帖子中的方法进行尝试,我也没有在尝试完一种方法之后还原我的环境,这个可能就导致这种方法中的less文件没有生效。
2)需要手动还原环境:我将node_modules中的文件全部清空,并把package中的跟我尝试添加的跟less相关的依赖配置全部删除,再执行npm install重新安装。再照方法2中的步骤进行配置,即可实现nextjs支持less(如何解决样式文件不生效)

下面是没有成功解决,尝试过的方法。
以下方法的优点:
1)步骤雷同,方法简单
缺点:
1)less文件导入之后,运行就会报错,报没有less loader这种问题,在安装依赖的时候,这些都已经安装过,也没有找到解决这类问题的方案
2)方法本身安装好后运行也会有报错情况,可采纳的文档不多,很难找到解决方案。如方法一中:

方法1:

npm install --save @zeit/next-less less

在next.config.js中加配置:

const withLess = require('@zeit/next-less')
module.exports = withLess({cssModules: true
})

方法3:

npm install next-plugin-antd

在next.config.js中加配置:

const withLess = require('next-plugin-antd')
module.exports = withLess({
})

方法4:

npm install next-with-less

在next.config.js中加配置:

const withLess = require('next-with-less')
module.exports = withLess({
})
1)  "@zeit/next-less": "^1.0.1"2)  "next-plugin-antd-less": "^1.8.0"3)  "next-with-less": "^2.0.5"4)  "next-plugin-antd": "^0.2.0"

nextjs12支持less相关推荐

  1. Chrome不支持showModalDialog的解决方案

    Chrome不支持showModalDialog的解决方案 昨天在使用showModalDialog的时候,遇到如下问题: 如果子窗口被刷新过,那么父窗口就接受不到子窗口的返回值. 为了解决这个问题, ...

  2. app如何打开了request url_手机日历app内如何打开节日提醒功能?支持提前提醒节日的云便签...

    我们一年中要度过的节日有很多,除了法定节假日之外,还有其他的很多节日,例如西方传来的圣诞节.万圣节,国际性的节日例如父亲节.母亲节等,还有一些传统节日例如小寒.冬至.腊八等,这些都是不放假的. 有时候 ...

  3. gcc 自动识别的文件扩展名,gcc/g++ -x 选项指定语言,不同 gcc 版本 -std 编译选项支持列表

    对于执行 C 或者 C++ 程序,需要借助 gcc(g++)指令来调用 GCC 编译器. 对于以 .c 为扩展名的文件,GCC 会自动将其视为 C 源代码文件 对于以 .cpp 为扩展名的文件,GCC ...

  4. HTTP 协议入门 — (TCP/IP协议族、通信传输流、URI 与 URL 的区别、Cookie 状态管理、HTTP 支持的方法、状态码类别、HTTP 首部字段)

    TCP/IP协议族 在介绍 HTTP 协议之前,我们先对 TCP/IP 协议族有个大概的了解,TCP/IP 协议从上到下主要分为应用层.传输层.网络层和数据链路层,各层的主要功能如下表所示: 协议层 ...

  5. 计图(Jittor) 1.1版本:新增骨干网络、JIT功能升级、支持多卡训练

    计图(Jittor) 1.1版本:新增骨干网络.JIT功能升级.支持多卡训练 深度学习框架-计图(Jittor),Jittor的新版本V1.1上线了.主要变化包括: • 增加了大量骨干网络的支持,增强 ...

  6. MindSpore特性支持类

    MindSpore特性支持类 Q:请问MindSpore支持梯度截断吗? A:支持,可以参考梯度截断的定义和使用. Q:如何在训练神经网络过程中对计算损失的超参数进行改变? A:暂时还未有这样的功能. ...

  7. MindSpore算子支持类

    MindSpore算子支持类 Q:在使用Conv2D进行卷积定义的时候使用到了group的参数,group的值不是只需要保证可以被输入输出的维度整除即可了吗?group参数的传递方式是怎样的呢? A: ...

  8. MindSpore图像分类模型支持(Lite)

    MindSpore图像分类模型支持(Lite) 图像分类介绍 图像分类模型可以预测图片中出现哪些物体,识别出图片中出现物体列表及其概率. 比如下图经过模型推理的分类结果为下表: 使用MindSpore ...

  9. MindSpore静态图语法支持

    MindSpore静态图语法支持 概述 在Graph模式下,Python代码并不是由Python解释器去执行,而是将代码编译成静态计算图,然后执行静态计算图. 关于Graph模式和计算图,可参考文档: ...

最新文章

  1. markdown编辑
  2. layer.open 模态弹窗, 隐藏关闭按钮, 隐藏按钮组
  3. html引入另一个html
  4. JavaScript操作DOM元素
  5. mysql中的删除语法错误_mysql – EXPLAIN中的SQL语法错误
  6. run、kill、return、stoprobot、stop
  7. leetode题库5438--制作 m 束花所需的最少天数
  8. memcached—Memcache安全性
  9. 智能美观网速快 有这样的无线路由吗?
  10. C4D常用快捷键与自定义快捷键分享
  11. 传智播客java测试题_传智播客java测试题
  12. linux查看tomcat版本信息,linux下tomcat版本查看
  13. linux红帽子镜像下载,红帽Red Hat Linux相关产品iso镜像下载
  14. linux服务器根据requestId查看日志
  15. 一块硬盘的爱情故事,好揪心
  16. win7、win10常用快捷键
  17. java.net.ConnectException: [NACOS HTTP-POST] The maximum number of tolerable server reconnection err
  18. 简单的猜数字游戏--入门
  19. s型增长的matlab曲线图,matlab拟合s型曲线
  20. 计算机二级长春光华学院,长春光华学院排名2021 吉林排名第3全国排名第73

热门文章

  1. KFS源码编译与安装
  2. LeetCode-5040-边框着色-C语言
  3. 再添理事成员:麒麟软件、浪潮信息、中科曙光、新华三加入龙蜥
  4. HDFS的特性,hdfs的安全模式,Hdfs的文件权限验证
  5. 元宇宙迷思:你能躲得开元宇宙吗?
  6. 佛祖保护,代码永无bug
  7. 计算机大数乘法引发的思考
  8. 爬虫拉勾网职位的数据表设计
  9. android 4.4 hifi,海贝(HiBy)R5安卓高解析无损播放器 4.4平衡随身听便携HIFI 双向蓝牙 铝合金黑色...
  10. java dns缓存清理_JVM DNS缓存问题