问题描述
在使用 Babel 编译 ES6 代码时，有时会遇到一个看起来很奇怪的错误：
SyntaxError: unknown: Invalid character '\u200B' (0x1e)).
这个错误通常会在使用了某些 ES6 新特性时出现，比如使用了 Symbol 类型。
问题原因
这个错误的原因是因为 Babel 并不支持 ES6 中的一些新特性，比如 Symbol 类型。因此，在编译这些代码时，Babel 无法正确地将它们转换成 ES5 格式的代码。
具体来说，Symbol 类型在 ES6 中是一种新的原始数据类型，用于表示一个独一无二的值。然而，在 ES5 中并不存在这种类型，因此 Babel 无法将 Symbol 类型正确地转换成 ES5。
解决方案
为了解决这个问题，我们需要借助一个叫做 babel-plugin-transform-runtime 的 Babel 插件。这个插件可以帮助我们在编译时自动引入 babel-runtime，从而提供一些 ES6 中缺失的新特性。
具体来说，这个插件会将代码中的所有 Symbol 类型替换成一个运行时的函数调用，从而避免了在编译时无法识别的问题。
下面是一个示例代码：
// 使用 Symbol 类型
const foo = Symbol('foo')
// 编译结果
var _Symbol$for = require("babel-runtime/core-js/symbol/for");
var foo = _Symbol$for('foo');可以看到，在编译后的代码中，所有的 Symbol 类型都被替换成了 _Symbol$for 函数调用。
使用步骤
下面是一些简单的步骤，以帮助你在项目中使用 babel-plugin-transform-runtime 插件。
- 首先使用 npm 安装插件：
npm install babel-plugin-transform-runtime --save-dev
- 在
.babelrc文件中添加插件：
{
"plugins": ["transform-runtime"]
}- 然后重新运行 Babel 编译命令即可：
babel src --out-dir lib
总结
在使用 Babel 编译 ES6 代码时，尤其是在使用一些新的 ES6 特性时，可能会遇到一些奇怪的错误，比如无法识别的 Symbol 错误。为了解决这个问题，我们可以使用 babel-plugin-transform-runtime 插件来自动引入 babel-runtime，从而提供一些 ES6 中缺失的新特性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6519311895b1f8cacd16676e