react如何添加less环境配置
更新时间：2022年05月28日 10:54:48 作者：书池
这篇文章主要介绍了react如何添加less环境配置，本文给大家分享遇到问题及解决方案，结合示例代码图文给大家介绍的非常详细，需要的朋友参考下吧
1.安装less
npm install less-loader less --save-dev
2.找到node_modules文件夹里react-scripts/config/webpack.config.js
在这个下面添加less相关配置
const lessRegex = /\.less$/; const lessModuleRegex = /\.module\.less$/;
3.然后往下翻代码到下图
在这段代码下面加
{
test: lessRegex,
exclude: sassModuleRegex,
use: getStyleLoaders(
{
importLoaders: 2,
sourceMap: isEnvProduction && shouldUseSourceMap,
},
'less-loader'
),
sideEffects: true,
},
{
test: lessModuleRegex,
use: getStyleLoaders(
{
importLoaders: 2,
sourceMap: isEnvProduction && shouldUseSourceMap,
modules: true,
getLocalIdent: getCSSModuleLocalIdent,
},
'less-loader'
),
},4.在src目录下创建一个less文件，里面写样式
5.引入
6.如果启动报错如下，就说明less-loader版本太高
7.解决方案，修改less-loader版本，大概6.0.0就好了
npm install less-loader@6.0.0
到此这篇关于react如何添加less环境配置的文章就介绍到这了,更多相关react添加less环境配置内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
本文将从最基础的项目搭建开始讲起，做一个基于react和antd的后台管理系统，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-06-06
这篇文章主要介绍了使用Redux处理异步问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
React是一种广泛使用的JavaScript库,为构建用户界面提供了强大的工具和技术,这篇文章主要给大家介绍了关于2023年最新react面试题的相关资料,文中还附有详细答案,需要的朋友可以参考下2023-10-10
React路由的history对象的插件history的使用解读
这篇文章主要介绍了React路由的history对象的插件history的使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
这篇文章主要为大家介绍了ReactJS中不同类型的状态详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-12-12
高阶组件就是接受一个组件作为参数并返回一个新组件（功能增强的组件）的函数。这里需要注意高阶组件是一个函数，并不是组件，这一点一定要注意，本文给大家分享React 高阶组件HOC使用小结，一起看看吧2023-01-01
antd-react使用Select组件defaultValue踩的坑及解决
这篇文章主要介绍了antd-react使用Select组件defaultValue踩的坑及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-05-05
这篇文章主要为大家详细介绍了如何基于React.js实现兔兔牌九宫格翻牌抽奖组件，文中的示例代码讲解详细，感兴趣的小伙伴可以了解一下2023-01-01
React如何使用create-react-app创建react项目
这篇文章主要介绍了React如何使用create-react-app创建react项目问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
这篇文章主要为大家详细介绍了react实现动态选择框，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-08-08
最新评论