Browserify 或 Babel 插入特殊字符答案

【问题标题】：Browserify or Babel inserting special characterBrowserify 或 Babel 插入特殊字符
【发布时间】：2015-06-30 13:47:33
【问题描述】：

我正在使用带有 babel 的 browserify 作为转换。一个特殊字符 (Â) 正在添加到我自己的脚本以及各个地方的其他模块中。此构建/编译在 Windows 机器上。

NPM 构建脚本

browserify -s appClient source/app-client.js -t babelify > build/app-client.js

输入片段：

return (
  <p>Hello,&nbsp;<span
      onClick = { () => setMode('edit') }
      style = { styles.displayMode }
      >{ word }!
      </span>
      <input
        onKeyUp = { onKeyUp}
        placeholder = { word }
        ref = 'wordInput'
        style = { styles.editMode }
      />
  </p>)

}

输出：

Hello,Â world!

奇怪的是Â 是由&nbsp; 生成的，而不是&nbsp。所以也许我不是在看构建过程。

我可以手动编辑 JavaScript 文件以删除特殊字符。

【问题讨论】：

在您的 IDE 中将受影响文件的编码类型设置为 utf-8。然后将<meta charset="UTF-8"> 添加到您的html 页面。这应该可以解决所有错误字符的问题
成功了。我不认为 JS 文件也受到元标记的影响，显然是这样！你能把你的评论变成答案吗？

标签： reactjs gulp browserify babeljs

【解决方案1】：

在您的 IDE 中将受影响文件的编码类型设置为 utf-8。

然后添加...

<meta charset="UTF-8">

...到您的 html 页面。这应该可以解决所有错误字符的问题。

注意：当内容未保存为unicode 时，单独的meta 标记是不必要的。它只会导致页面将所有内容解释为utf-8 (unicode)。

【讨论】：