如何在Babel 6中使用babel-runtime?
我正在尝试创buildnpm模块,并且在官方的babeljs网站上找不到单个指令。 你如何使用babel-runtime软件包? 从名字我猜它应该被放置在package.json的“依赖”部分,对吧?
这里绝对没有信息: https : //github.com/babel/babel/tree/master/packages/babel-runtime
在这里find一个例子: https ://strongloop.com/strongblog/javascript-babel-future/但是当我运行“babel -h”时,它没有列出–optional作为一个有效的参数。
运行时是可选的,但是和Babel 6中的其他一样,主要是通过添加一个插件来实现的。 在这种情况下,你需要http://babeljs.io/docs/plugins/transform-runtime/
plugins: ["transform-runtime"]
-
babel-runtime
是一个包含polyfill和Babel可以引用的许多其他事物的包。 您可以使用npm install babel-runtime
将其安装到您的应用npm install babel-runtime
-
transform-runtime
是一个Babel插件,用于处理源代码,并import foo from "babel-runtime"
语句注入import foo from "babel-runtime"
以便实际使用babel-runtime
。 你也可以用npm install babel-plugin-transform-runtime
。
合理
在编译你的代码时,Babel实际上会注入助手来模拟目标ES版本不支持的function。
例如, class MyClass {}
利用内联帮助程序_classCallCheck
,这也可以通过require('babel-runtime/helpers/classCallCheck')
。
默认情况下,这些助手不在编译单元(文件)之间共享。 巴贝尔团队虽然在某个时候将所有这些助手集中在一个地方,尤其是当他们被多次使用时,可能会很有趣。
这个问题已经通过创buildbabel-plugin-transform-runtime
插件得到了解决,该babel-plugin-transform-runtime
AST,并且通过适当的require将helpers注入replace为babel-runtime
模块。 这样,助手就可以在代码库中共享,避免了重复。
如何使用它
假设你有一个正在运行的Babel环境 :
- 安装
babel-plugin-transform-runtime
(作为一个devDependency
),它转换你的代码以删除helpers并使用babel-runtime
中的helpers。 你需要把它添加到你的Babelconfiguration中的plugins
数组中 - 安装
babel-runtime
(作为一个dependency
),这是实际的库babel-plugin-transform-runtime
假定你将在你的dependencies
,它将在运行时被你的编译代码使用。 你只需要安装它(不需要它)
最小的片段
-
npm run build
将lib
文件夹编译成dist
-
npm start
启动dist
文件夹(依赖于babel-runtime
)
的package.json
{ "scripts": { "build": "babel lib --out-dir=dist", "start": "node dist" }, "dependencies": { "babel-runtime": "^6.9.2" }, "devDependencies": { "babel-cli": "^6.10.1", "babel-plugin-transform-runtime": "^6.9.0" }, "babel": { "plugins": [ "transform-runtime" ] } }