Reactjs 使用Webpack 1生成时，从react intl消息呈现反斜杠

摘要

当我使用Webpack Dev Server加载我的应用程序时，我的消息显示良好：

\

。但是，当我将应用程序绑定到磁盘和服务器时 通过

nginx

，我看到一个反斜杠的副本：

\

详细信息

我正在使用

react intl

@2.2.3（最新版本）和

babel plugin react intl

@2.3.1（最新版本）。我的目标是用

\

字符定义默认消息，并以任何方式呈现它（

FormattedMessage

，

FormattedMessage

，等等）

我正在使用Webpack/Babel捆绑我的应用程序。我的

webpack.config.js

文件中没有Babel/react intl特定的配置，但是我使用

DefinePlugin

将

process.env

设置为

'development'

或

'production'

当我使用Webpack Dev Server加载我的应用程序时，我的消息会很好地显示：

\

。但是，当我将应用程序捆绑到磁盘并通过

nginx

提供捆绑时，我看到了反斜杠的重复：

\\

。我这里有以下说明：关于使用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={ '\\\\' } />

---

使用unicode字符而不是实际的反斜杠。反斜杠unicode是

\u005C

。因此，呈现一个反斜杠看起来是这样的：

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

或者，如果要在一行中渲染两个反斜杠：

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

或者这个，如果你刚刚处理完；）

---

最后一个代码将呈现：

“”\_(ツ)_/“

嗨！一年后你找到解决方案了吗？它仍然坏了，可能永远都坏了。Ember js甚至用react intl message formatter来修复它。解决这个问题的一个方法是使用╲ （\u2572）而不是真正的反斜杠。或符号∖, \u2216

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