react项目支持使用less处理方式

react创建后不支持less,需要配置wabpack支持less-loader。

补充:react项目创建js 或者jsx项目,点击可见

一:安装:less 和 less-loader(任选一种)

npm方式:
	npm install less less-loader --save

cnpm方式:
	cnpm install less less-loader --save
	
yarn方式:
	yarn add less less-loader

二:暴露项目配置项(任选一种)

注意:此步骤不可逆 ,最好备份下项目再进行。

若报错,有git的可以通过 
	git add .
	git commit -m '暴露项目配置项'
	npm run eject
npm方式:
	npm run eject

cnpm方式:
	cnpm run eject
	
yarn方式:
	yarn eject

三:配置webpack.config.js

文件:config / webpack.config.js,

修改前:
在这里插入图片描述
修改后:

const cssRegex = /\.(css|less)$/;
const cssModuleRegex = /\.module\.(css|less)$/;

修改前:
在这里插入图片描述

修改后:
在这里插入图片描述

	  {
        loader: require.resolve('less-loader'),
        options: lessOptions,
      },

四:配置完成,重启项目即可


备注:webpack v4版本 eject暴露后位置不一样,大同小异

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
"Cannot read properties of undefined (reading 'getStackAddendum')"错误通常出现在使用React时,尝试访问未定义的属性或方法时。这可能是由于以下几个原因之一导致的: 1. 没有正确导入或安装所需的依赖。请确保您已经安装了所有必需的依赖项,并正确导入它们。 2. 某个变量或对象未正确初始化或赋值。请检查代码中是否存在任何未定义的变量或对象。 3. 在访问属性或方法之前,尝试在未定义的变量或对象上执行操作。在访问属性或方法之前,请确保变量或对象已经被正确初始化。 对于您的第一个问题,当使用create-react-app创建的项目时,可能会发生此错误。您可以尝试执行以下步骤来解决该问题: 1. 确保您已经正确配置了项目中的所有依赖项,并且这些依赖项已经正确安装。 2. 检查代码中是否存在任何变量或对象未定义的情况。确保在访问属性或方法之前,变量或对象已经被正确初始化。 3. 如果您使用了babel-plugin-react-remove-properties插件,请确保您已经正确安装并配置了该插件。您可以尝试重新安装该插件,或检查相关的配置文件,以确保插件正确运行。 对于您的第二个问题,如果您无法编译less文件并且定制的主题无效,请确保您已经正确配置了支持antd的定制主题。您可以尝试执行以下步骤来解决该问题: 1. 确保您已经正确安装了less和less-loader依赖项。您可以使用npm或yarn来安装这些依赖项。 2. 检查webpack配置文件或其他相关配置文件,确保less-loader正确配置并能够编译less文件。 3. 确保您正确导入并使用了所需的antd组件,并在代码中应用了自定义的主题样式。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值