react中用less的问题
更新时间：2024年04月19日 08:26:50 作者：Mr_wuying
本文主要介绍了react中用less的问题，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
加载依赖
yarn add @craco/craco less less-loader --dev
npm install craco-less
在这里你要用到@craco/craco，less，less-loader，craco-less
这里添加依赖会出现兼容问题craco-less 跟react-scripts和@craco/craco版本兼容
https://www.npmjs.com/package/craco-less
官网上有给到可兼容的版本信息
修改一下本地项目版本
npm add --exact react-scripts@5.0.1 -D
npm add --exact @craco/craco@7.1.0 -D
创建文件
然后在项目的根目录建craco.config.js
craco.config.js
const lessPlugin = require("craco-less");
module.exports = {
// 插件
plugins: [
{
plugin: lessPlugin,
options: {
lessLoaderOptions: {
lessOptions: {
// antdv 主题之类的配置
// modifyVars: { "@primary-color": "#1DA57A" },
javascriptEnabled: true
}
}
}
}
],
}
修改文件package.json
将 react-scripts 相关的脚本替换为 craco。修改 package.json 文件中的 scripts 部分，如下所示：
"scripts": {
"start": "craco start",
"build": "craco build",
"test": "craco test",
"eject": "react-scripts eject"
},补充
如果出现下面报错
解决办法
cnpm install axios qs --save cnpm install antd babel-plugin-import --save
在执行 npm start
到此这篇关于react中用less的问题的文章就介绍到这了,更多相关react less 内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
在React应用中,组件间的通信是常见的需求,通常,父组件通过props向子组件传递数据,但有时也需要子组件向父组件传递数据,本文将探讨如何在React中实现子组件向父组件传值的几种方法,需要的朋友可以参考下2025-04-04
React Native第三方平台分享的实例（Android，IOS双平台）
本篇文章主要介绍了React Native第三方平台分享的实例（Android，IOS双平台），具有一定的参考价值，有兴趣的可以了解一下2017-08-08
这篇文章主要介绍了React Native 加载H5页面的实现方法，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2022-04-04
这篇文章主要介绍了React 模块联邦多模块项目实战详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-10-10
这篇文章主要介绍了react中使用usestate踩坑及解决，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了react ant protable自定义实现搜索下拉框，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-06-06
本文主要介绍了React 记忆缓存的三种方法实现,包含React.memo、useMemo、useCallback,用于避免不必要的组件重渲染和计算,感兴趣的可以了解一下2025-09-09
这篇文章主要介绍了react中使用css的7中方式(最全总结)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-02-02
这篇文章主要介绍了React 错误边界组件的处理，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-04-04
这篇文章主要介绍了react学习笔记之state以及setState的使用,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-12-12
最新评论