react+ant design,如果升级antd版本，导致样式不生效解决方案

最新推荐文章于 2024-08-28 00:07:45 发布
最新推荐文章于 2024-08-28 00:07:45 发布
阅读量2.1k 收藏
点赞数
文章标签： react.js javascript 前端 ant design npm
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_27010291/article/details/123289832
版权

升级antd，我用的命令是：

npm i antd@4.17.0 --save

其中@号后面是升级的版本号，

本地用的是yarn，在项目的根如今下重新加载命令

yarn install

然后查看pakeage.json文件

启动项目之后，如果发现新增加的一些不生效，可能是对自定义的主题没有更新

需要执行命令：yarn theme（非常重要）

然后再启动项目，就生效了，

haors
关注
ant design pro升级v4指南(附umi3与antd4升级)
广兰路地铁的博客
04-11 9125
前言 自己在去年用ant design pro 创建了个后台服务的项目，当时创建的时候umi控制台提示是否使用antd 4,当时抱着尝鲜的想法选择了yes,结果项目跑起来之后，功能没有问题，但是打开后台后发现各种提醒你升级或者迁移的warning,类似这样： 看着着实蛋疼，ant design pro 本质上是蚂蚁全家桶，结合了antd和umi的一整套后台项目解决方案，如果要解决这些warnin...
react+AntDesign 之 pc端零到一
Jasmin博客
01-04 1594
react pc端项目案例
记录升级andproV5以后遇到的样式问题不兼容部分浏览器
weixin_43933139的博客
02-23 614
官方说了 不再支持antd.css 而是采用了CSS-in-JS。完事 虽然有点不太一样 圆角有调整 但 也不是不能接受 对吧。把这个文件copy到你的v5项目中 在app.js中引入。那么 我是不是可以引入之前的antd.css呢。看一下在谷歌浏览器的表现 一切正常。发现 类名和之前的是差不多一致的。在看看部分浏览器 样式全无。细心的我审查了一下元素。
【React+Antd】时代在变迁，它们在进化
最新发布
weixin_45718102的博客
08-28 193
1. 这段用的ts，document.getElementById('root')!是一个非空断言操作符，用于告诉编译器结果不会是null或undefined。2. StrictMode开启严格模式，帮助在开发过程中发现潜在的问题。React从我学习用的17也升了一个大版本到18辽。Bilan：框架都在改进借鉴，不持续学习怎行捏……的RTL版本还是4.24.16，未来可期~新入口函数，用于创建一个新的React根。以前考虑到文件大，还得按需引入。#果然一阵不碰就更新换代#使用趋向友好，但目前。
React项目引入Antd后经过Webpack打包，没有任何报错，但是组件样式不生效。
XiaoSen207的博客
06-24 1919
在安装Antd之后，经过Webpack打包，组件样式不生效。如图，在引入Button按钮后，样式不生效。 刚开始的时候以为是class没有绑定上，所以打开了开发者工具，找到了改按钮的代码，通过查看代码，确定了class确实已经绑定在这个按钮上了，然后再接着查看目录，里面也确实有文件。很明显的这里已经是被css样式渲染了，但是按钮依旧是没有效果。 ， 因为这个项目经过了webpack打包，所以我便怀疑是因为webpack打包引起的问题，所以 我创建了一个新的React项目，也不引入Webpack，只引入了A
ant-design日期组件DatePicker国际化失效
CRongbo的专栏
08-30 1778
解决:ant-design日期组件DatePicker国际化失效
ant-design-vue 4.x升级问题-样式丢失问题
前端
08-05 4001
该文档是在升级ant-design-vue到4.x版本的时候遇到的问题。
React项目按需引入Ant Design Mobile后，样式文件不生效的解决方案
weixin_45253371的博客
04-25 2354
背景介绍： 在 React 项目中，为了减小包的体积，在确定了使用 Ant Design Mobile UI组件库之后，按照官方文档，采用按需引入的方案，引入组件后，样式文件并未生效 测试按需加载组件 // 按照官方文档在 **App.js** 中引入 Button 按钮测试是否生效 import { Button } from 'antd-mobile' function App () { <div> <Button type="primary">快点我~~~<
React + Ant Design开发环境搭建
qq_33414883的博客
08-21 1214
基础知识 1.使用脚手架创建项目并启动 ​ 1.1 安装脚手架： npm install -g create-react-app ​ 1.2 使用脚手架创建项目： create-react-app antd-start-demo antd-start-demo为项目名。 ​ 1.3 启动 npm start 2.npm转换为yarn ​ 2.1 安装yarn： npm install -g yarn ​ 2.2 获取yarn当前的镜像源： yarn config get regis
React降级配置及Ant Design配置详解
10-17
对于Ant Design的配置，首先安装`antd`库，然后安装按需加载组件和样式的插件，例如`babel-plugin-import`。在`package.json`的`babel`配置段内，设置相应的规则以实现按需加载。选择一个组件（如`Button`）进行测试...
react + Ant design项目中，使用Menu+Switch时遇到的问题
发果叁
06-09 1034
这个标题我实在是不知道该怎么起，之前一直在搞的vue的项目，react之前用的时候写的是很简单的，最近的一个react项目，前端部分从项目搭建到页面实现基本全是我一个人完成。前端UI组件使用的是Ant Design。 我进行刷新操作，发现仍是不起作用，然后我就想不明白，于是我又仔细看了一下代码，发现了Menu.Item的key我使用的是我map的时候的下标，而不是路由，我改了之后，它就好了。 2. 因为做的是一个后台管理系统，所以就涉及到权限问题，我们的menu是通过antd的Switch来控制是否显示权
react 关于自定义样式引入和ant-design样式引入配置问题
02-22
在React开发过程中，为了实现应用的个性化样式设计和利用第三方库如Ant Design的美观组件，我们需要正确地管理和引入自定义样式以及库样式。本话题主要关注如何在React项目中配置Webpack或其他构建工具，以实现...
解决React中使用antd组件库没有样式
weixin_45815479的博客
04-14 3000
一、问题 在学习React的antd组件库时，发现下载antd包后样式没有正常显示。 二、解决方法 在index.js中引入 import 'antd/dist/antd.min.css' 即可解决问题：
解决同时使用antd俩个不同版本的样式错乱问题
吴小迪的博客
04-10 1941
本文讲的是vue项目中用ant-design-vue，react用antd的话也是类似的道理。如果大家实在弄不来的话可以给笔者留言（看到了会协助你进行解决），然后笔者后面追加一个react的解决过程。
react无法安装antd ui
rng2uzi的博客
04-21 1368
最近接了一个react的项目，是一个老的项目，之前同事都是手写样式包括提示框登录框，而且样式用的是.style结尾的文件，导致各种ui库导入不进去。 解决办法，还是老一套安装antdui的流程，在这里不做详细介绍。引入流程还是正常的引入流程，我直接进入页面讲解。 import { Form, Input, Button, Checkbox, message } from 'antd'; 正常的使用这个后样式竟然无效，但是我观察了一下方法是执行的。 解决的办法就是：直接进入安装的node包中把css复制出来，
react框架从18版本降低至16.10版本后npm安装antd失败问题解决记录
UnhappyEgg的博客
03-16 281
命令安装antd包。这个命令将安装antd并强制解决依赖项冲突问题。
react项目中使用antd引入出现问题
m0_45305745的博客
07-28 354
React中用antd出现问题
antd从v3升级到v4
qq_49464155的博客
02-18 4989
因为项目需求，需要对antd进行一个升级，下面我简述下我升级的步骤 1. 安装最新版本antd，升级项目 React 16.12.0 以上 2. 若项目中使用了Form表单/Icon组件 安装@ant-design/compatible，然后在之前使用Icon/Form组件的地方使用如下引用方式就可以了，这个只是个兼容性办法，项目可以正常运行，控制台会有警告，等以后有时间了再切换成antd的组件 import { Form, Icon } from '@ant-design/compatible'
react+antd解决样式不生效问题
Sunny_lxm的博客
03-18 9028
react创建项目时暴露webpack文件，添加antd时样式不生效，报错。更改webpack配置
ant design 3 locale 国际化配置不生效 如何解决
07-12
对于 Ant Design 3 的国际化配置不生效的问题，您可以尝试以下解决方法： 1. 确保已经正确引入了对应的语言包。Ant Design 3 默认支持中文和英文，如果需要其他语言，可以引入相应的语言包。例如，如果需要使用法语...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值