打包后 国际化问题比较多 部分地方显示异常， 传参失败 甚至影响到了布局

[zmm2tysu]

请酌情提供细节，并保持issue精简便于查阅

1. 功能需求 => 详细说明
   需要对国际化中变量传参
2. Bug反馈
   没有传递成功，
   2.1 简单描述下报错
   没有报错
   2.2 你期望什么结果
   希望传参数成功
   2.3 如何操作导致的
   目前不清楚啥原因
   2.4 可提供运行环境信息
3. 代码求助 => 可以提，未必及时答复

[zmm2tysu]

本地开发环境一开始也是这样的，后面打包后 线上是这样 本地开发环境变好了。。。我该怎么排查这个问题

[superlbr]

Pagination中设置showTotal试试

[zmm2tysu]

@sorrycc

本地开发环境是好的

[zmm2tysu]

感觉多语言这部分 打包后 问题很多 是不是我流程没用对啊？
需要yarn build前 执行 yarn compile命令嘛？

[superlbr]

需要yarn build前 执行 yarn compile命令嘛？

并没有compile命令

作为对照，可以尝试直接在本项目做改动，看打包正常不

[zmm2tysu]

需要yarn build前 执行 yarn compile命令嘛？

并没有compile命令

作为对照，可以尝试直接在本项目做改动，看打包正常不

就是只需要yarn trans命令识别字段然后翻译就好了？ 好的我试下

[zmm2tysu]

我这么写可以不？ 就是key用的中文名
因为当时key如果是英文的话 翻译文件不翻译

[superlbr]

随便玩

[zmm2tysu]

@superlbr 我从github上面下载的项目，没有改locale文件，直接打包一样国际化有问题;
比如下面是点了中文后 文本框显示的还是英文，按钮是中文，包括下面我在guest旁边放了一个传参的Trans也是没有成功

[superlbr]

t似乎无法使用，改成如下则ok

            <FormItem name="password"
              rules={[{ required: true }]} hasFeedback>
                <Trans id="Password" render={({translation}) => (
                  <Input type='password' placeholder={translation} required />)} 
                />
            </FormItem>

[zmm2tysu]

login.js 我就加了这一行，盲猜是包版本的问题

models/app.js 直接跳到登录页

.umirc.js

改了这三个地方,打包后就出问题了

[zmm2tysu]

@开发环境下还发现了一个问题，如图

[zmm2tysu]

t似乎无法使用，改成如下则ok

            <FormItem name="password"
              rules={[{ required: true }]} hasFeedback>
                <Trans id="Password" render={({translation}) => (
                  <Input type='password' placeholder={translation} required />)} 
                />
            </FormItem>

这么改以后 表单获取不到值，校验不通过

[superlbr]

login.js 我就加了这一行，盲猜是包版本的问题

Trans不是这么用的，应该这么写: <Trans>Total</Trans>{ test }<Trans>Items</Trans>

models/app.js 直接跳到登录页

就是这么设计的

这么改以后 表单获取不到值，校验不通过

把FormItem弄到里面，这么写：

 <Trans id="Password" render={({translation}) => (
      <FormItem name="password" rules={[{ required: true }]} hasFeedback>
           <Input type='password' placeholder={translation} required />
      </FormItem>)} 
 />

[zmm2tysu]

@superlbr 后面我就用Trans不用t了是吧

[superlbr]

目前来看是这样

[zmm2tysu]

@superlbr
我弄好了，参照下面这个issue，需要lingui compile命令
lingui/js-lingui#719 (comment)
打包后也能用t``传参数了

layout/index.js代码

import React, { Component } from 'react'
import { withRouter } from 'umi'
import { ConfigProvider, message } from 'antd'
import { i18n } from '@lingui/core'
import { I18nProvider } from '@lingui/react'
import { getLocale } from 'utils'
import { zh, en } from 'make-plural/plurals'

import zhCN from 'antd/lib/locale/zh_CN'
import enUS from 'antd/lib/locale/en_US'
import { messages as zh_CN } from '../locales/zh/messages'
import { messages as en_US } from '../locales/en/messages'

import BaseLayout from './BaseLayout'

message.config({ maxCount: 1 })

i18n.loadLocaleData({
  en: { plurals: en },
  zh: { plurals: zh },
})

i18n.load({
  en: en_US,
  zh: zh_CN,
})

const languages = {
  zh: zhCN,
  en: enUS,
}
@withRouter
class Layout extends Component {
  render() {
    const { children } = this.props

    let language = getLocale()
    i18n.activate(language)

    return (
      <ConfigProvider locale={languages[language]}>
        <I18nProvider i18n={i18n}>
          <BaseLayout>{children}</BaseLayout>
        </I18nProvider>
      </ConfigProvider>
    )
  }
}

export default Layout

[hhniao]

@zmm2tysu 我参考你的也弄好了
复制 @zmm2tysu 的代码替换 src/layouts/index.js
package.json 添加以下代码

"scripts": {
  "compile": "lingui compile",
}

运行 yarn compile
运行 yarn build

[LDD123]

这是来自QQ邮箱的假期自动回复邮件。你好，我最近正在休假中，无法亲自回复你的邮件。我将在假期结束后，尽快给你回复。