4

概括

当我使用 Webpack Dev Server 加载我的应用程序时，我的消息显示正常： \. nginx但是，当我将应用程序捆绑到磁盘并通过\\.

细节

我正在使用react-intl@2.2.3（此时最新）和babel-plugin-react-intl@2.3.1（此时最新）。我的目标是使用\字符定义默认消息并以任何方式呈现它（FormattedMessage,formatMessage等）

我正在使用 Webpack / Babel 捆绑我的应用程序。我的webpack.config.js文件中没有 Babel / react-intl 特定配置，但是我确实使用DefinePlugin设置process.env为'development'或'production'

当我使用 Webpack Dev Server 加载我的应用程序时，我的消息显示正常：\. 但是，当我将应用程序捆绑到磁盘并通过 提供捆绑包时nginx，我看到我的反斜杠重复：\\. 我在这里有以下说明：https ://github.com/yahoo/babel-plugin-react-intl/issues/13#issuecomment-151944191关于使用 4 个\字符来显示最终\字符。

对于它的价值，我尝试过使用 JSX 字符串、JS 字符串、使用 1、2 和 4 个\字符，以及我能想到的任何其他愚蠢的组合。

非常感谢任何提示或建议。谢谢你。

代码示例

我如何定义消息的示例

import { defineMessages } from 'react-intl'


export default defineMessages({
  message: {
    id: 'anyId',
    defaultMessage: '\\\\',
  },
})

我如何呈现消息的示例

<FormattedMessage { ...messages.anyID } /></span>

另一个例子，它也不起作用

<FormattedMessage id='anyId' defaultMessage='\\' />

另一个失败的例子：

<FormattedMessage id='anyId' defaultMessage={ '\\\\' } />
4

1 回答 1

2

使用 unicode 字符而不是实际的反斜杠。反斜杠 unicode 是\u005C. 所以它看起来像这样呈现一个反斜杠：

    export default defineMessages({
        message: {
            id: 'anyId',
            defaultMessage: '\u005C',
        },
    })

或者如果你想连续渲染两个反斜杠：

    export default defineMessages({
        message: {
            id: 'anyId',
            defaultMessage: '\u005C\u005C',
        },
    })

或者如果你刚刚完成它;)

    export default defineMessages({
        message: {
            id: 'anyId',
            defaultMessage: '¯\u005C_(ツ)_/¯',
        },
    })

最后的代码将呈现：¯\_(ツ)_/¯

于 2019-06-07T15:07:12.763 回答