Question

摘要

当我使用Webpack Dev Server加载我的应用程序时，我的消息显示正常： \。但是当我将应用程序捆绑到磁盘和服务器时通过nginx捆绑，我看到我的反斜杠重复：\\。

详情

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

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

当我使用Webpack Dev Server加载我的应用程序时，我的消息显示正常：'production'。但是，当我将应用程序捆绑到磁盘并通过\提供捆绑包时，我看到我的反斜杠重复：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='\\' />

Answer 1

使用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_(ツ)_/¯',
        },
    })

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

使用Webpack 1

1 个答案: