react---umi配置国际化语言 locale 踩坑

最新推荐文章于 2024-05-08 14:02:50 发布
最新推荐文章于 2024-05-08 14:02:50 发布
阅读量5.8k 收藏 1
点赞数
文章标签： reactjs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_39788999/article/details/106965929
版权

因为项目创建的比较早,用的是umi2+版本,修改默认语言是英文,官方说直接改配置的defalut,但是我改完并不生效,可能是我的版本呢原因,找了好久,总算找到解决办法的方法了

其中我的项目版本使用的umi和国际化插件如下:

"umi": "^2.4.4",
 "umi-plugin-react": "^1.7.2"

1 修改默认显示语言,方法如下
在这里插入图片描述

2 再在app.js加入一下代码
在这里插入图片描述
小小的问题,可能是版本的原因,尝试了好久,也是挺折腾人的…

weixin_39788999
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
react-umi 国际化 （中英文切换）
mengfanyue123的博客
05-27 5270
.umirc.js国际化默认配置 export default { plugins: [ [ 'umi-plugin-react', { locale: { default: 'zh-CN', //默认语言 zh-CN baseNavigator: true, // 为true时，用navigator.language的值作为默认语言 antd: true // 是否启用antd的<Loca
umi_locale_bug
03-10
umi项目 入门 安装依赖项 $ yarn 启动开发服务器， $ yarn start
react使用umi-plugin-locale配置国际化
qq_45799465的博客
09-07 3960
一、umi-plugin-locale是什么 二、umi-plugin-locale的使用 formatMessage FormattedMessage 方法使用 与传值 三、语言随浏览器默认语言更换 四、注意事项 五、项目地址
React&nbsp；Umi国际化配置方法
最新发布
菜鸟教程
05-08 372
到此这篇关于React Umi国际化配置的文章就介绍到这了,更多相关React Umi国际化内容请搜索网赚博客https://www.piaodoo.com/以前的文章或继续浏览下面的相关文章希望大家以后多多支持网赚博客https://www.piaodoo.com/！教程下载地址： 网赚博客https://www.piaodoo.com/创业项目排行榜前十名https://www.piaodoo.com/茂名一技http://www.enechn.com/美文集http://www.tpyjn.cn/
轻松学 UmiJS 视频教程
求知久久编程学院
02-11 1578
轻松学 UmiJS 视频教程（35 个视频） 轻松学 UmiJS 视频教程 #1 介绍「04:03」 轻松学 UmiJS 视频教程 #2 快速上手「04:49」 轻松学 UmiJS 视频教程 #3 通过源码来了解 Umi「07:04」 轻松学 UmiJS 视频教程 #4 create-umi 如何使用「Pro」「08:08」 轻松学 UmiJS 视频教程 #5 与 dva 结合的点点滴滴「Pro」...
umi配置环境变量不生效问题（已解决！！）
hmjz_lf的博客
08-03 1467
最近接到公司需求需要使用react写项目，就使用了umi的4版本 ，但是读取环境变量的时候一直是undefined 不知道大家有没有遇到同样的问题。在根目录添加三个文件 分别为.umirc.dev(pre)(test).ts 使用透传配置config 其余两个文件只需更改dev即可。也是根据网上查询了很多的资料 也是看到有很多人都遇到了这个问题 改成这样子 不多说 直接上代码。可以看出打印出来了 问题解决啦！希望过路的大佬看到有什么不对的地方可以指点迷津。可以看出还是没有生效 后来又查询了相关文档。
react-intl实现React国际化多语言的方法
01-18
本文主要介绍了react-intl实现React国际化多语言的方法，分享给大家，具体如下： 效果预览 React Intl 国际化步骤 创建国际化资源文件 根据语言获取国际化资源 引入 react-intl 的 local data 创建 ...
模块化react-router配置方法详解
10-16
主要介绍了模块化react-router配置方法详解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
详解create-react-app 自定义 eslint 配置
08-27
主要介绍了详解create-react-app 自定义 eslint 配置，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
react-activation:真实的对于React
04-27
React激活 英文|Vue For React 函数的实现通过babel预编译更稳定的功能更多例子兼容性React v17 +（测试版） React v16 + Preact v10 + 与SSR兼容安装yarn add react-activation# ornpm install react-activation...
umi 国际化
qq_36258899的博客
03-13 1381
前言： 在做项目过程中，遇到一个需求就是支持多语言，实现国际化的功能。感谢React社区的强大，提供了 umi-plugin-locale插件来实现国际化的功能。 首先我们是基于 Umi 搭建的项目。 umi-plugin-locale 约定 在 src/locales 中引入 相应的 js，例如 en-US.js 和 zh-CN.js， 注意：文件名称要和locale的值要对应起来。 并且在项目配置文件中做如下配置： locale: { enable: true, // default f
处理umi国际化useIntl不能在类组件中使用
OnTheway
05-16 3940
问题描述 使用umi中useIntl在类组件中时报错。 Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: You might have mismatching versions of React and the renderer (such as React DOM) Y.
「SDUDOC」前端多语言国际化实现
u012922190的博客
06-10 428
SDUDOC实训记录 山东大学创新实训记录
react-umi 国际化
黄彪博客
07-15 7292
文章参考 umi-plugin-locale .umirc.js国际化默认配置 export default { plugins: [ [ 'umi-plugin-react', { locale: { default: 'zh-CN', //默认语言 zh-CN baseNavigator: true...
基于umi的Ant Design介绍
热门推荐
eunice_sytin的博客
10-30 2万+
1. 开发环境 1.1 安装 nodeJs,版本大于8.5.0。 1.2 安装cnpm获得更快速、更安全的包管理体验。(可选) npm install -g cnpm --registry=https://registry.npm.taobao.org 1.3 安装umi依赖 1. mkdir antd-umi-course 2. cd antd-umi-course 3. cnpm init -...
umi 项目配置
weixin_42114897的博客
04-09 1万+
一、运行配置 约定src/app.tsx为运行配置 配置项目 1.patchRoutes 修改路由，可获得整个路由系统 export function patchRoutes({ routes }) { routes.unshift({ path: '/foo', exact: true, component: require('@/extraRoutes/foo')...
react+antd+umi实现国际化语言
qq_33278354的博客
04-23 7848
1、配置： .umirc.js文件(如果已经存在，则增加locale配置) ['umi-plugin-react', { dva: true, antd: true, // antd 默认不开启，如有使用需自行配置 hardSource: true, locale: { enable: true, // default false default: 'zh-CN', /...
记录react-umi-国际化的问题
qq_43358937的博客
06-07 570
important { SelectLang } from 'umi'; <SelectLangclassName={styles.action}postLocalesData={()=>{ constnewLocales=[ { lang:'en-US', label:'English', icon:'US',...
02 基于umi搭建React快速开发框架(国际化)
dianchengsn076644的博客
09-19 583
前言 之前写过一篇关于React的国际化文章，主要是用react-intl库，雅虎开源的。react-intl是用高阶组件包装一层来做国际化。 基于组件化会有一些问题，比如在一些工具方法中需要国际化，就需要自己去实现了。在umi-react快速开发框架我们采用 react-intl-universal库来实现，不仅支持组件化调用，也支持动态调用，实现国际化。 react-intl-uni...
umi-plugin-react
07-28
umi-plugin-react是一个可插拔的企业级React应用框架的插件集，它集成了一些常用的进阶功能。通过在项目中添加该插件集，可以实现一些高级功能，如antd的使用和dva插件的开启。安装umi-plugin-react可以通过使用cnpm install umi-plugin-react --save-dev命令来进行安装。然后在配置文件config/config.js中引入该插件，并按需配置相应的功能。例如，可以通过配置antd: true来开启antd的使用，通过配置dva: true来开启dva插件的使用。\[1\]\[2\]\[3\] #### 引用[.reference_title] - *1* *2* *3* [使用umi脚手架来初始化React项目](https://blog.csdn.net/wwf1225/article/details/122957886)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值