我使用rollup和babel来传输一些ES6代码,并将结果打包到一个文件中,但是我遇到了babelHelpers对象的一些问题。
rollup.config.js:
export default {
entry: './src/js/core.js',
dest: './dist/output.js',
format: 'iife',
plugins: [babel({
externalHelpers: true,
runtimeHelpers: true,
presets: ["es2015-rollup"]
})],
treeshake: false,
useStrict: true
};.babelrc:
{
"presets": ["es2015-rollup"],
"plugins": [
"transform-class-properties",
"transform-es2015-classes",
"external-helpers-2"
]
}Package.json的一部分:
"scripts": {
"start": "npm-run-all --parallel rollup:watch lint:watch",
"rollup": "rollup -c",
"rollup:watch": "rollup -c -w",
"lint": "esw rollup.config.* src/js/** --color",
"lint:watch": "npm run lint -- --watch"
},
"dependencies": {
"babel-helpers": "^6.16.0",
"babel-plugin-external-helpers": "^6.18.0",
"babel-plugin-external-helpers-2": "^6.3.13",
"babel-plugin-transform-class-properties": "^6.19.0",
"babel-plugin-transform-es2015-classes": "^6.18.0",
"babel-plugin-transform-runtime": "^6.15.0",
"babel-polyfill": "^6.16.0",
"babel-preset-es2015-rollup": "^1.2.0",
"babel-preset-latest": "^6.16.0",
"eslint": "^3.11.1",
"eslint-plugin-import": "^2.2.0",
"eslint-watch": "^2.1.14",
"npm-run-all": "^3.1.2",
"rollup": "^0.36.4",
"rollup-plugin-babel": "^2.6.1",
"rollup-plugin-uglify": "^1.0.1",
"rollup-watch": "^2.5.0"
}core.js:
var configOptions = {
range: [0, 5],
arg: "speak",
options: ["listen", "mute", "speak"]
};
function updateOptions(opt) {
if (configOptions.range == undefined) {
configOptions.range = opt.range;
}
}
updateOptions({});
class Hello {
print() {
}
}
new Hello().print();捆绑-产出:
(function () {
'use strict';
var configOptions = {
range: [0, 5],
arg: "speak",
options: ["listen", "mute", "speak"]
};
function updateOptions(opt) {
if (configOptions.range == undefined) {
configOptions.range = opt.range;
}
}
updateOptions({});
var Hello = function () {
function Hello() {
babelHelpers.classCallCheck(this, Hello);
}
babelHelpers.createClass(Hello, [{
key: "print",
value: function print() {}
}]);
return Hello;
}();
new Hello().print();
}());因此,正如您在core.js中看到的那样,我使用的是ES6类。我希望babel只为使用过的对象添加多填充。目前,我只使用类,我希望babel只使用checkClassCall和其他函数来实现“类”功能。但它为我的最后一个包添加了完整的多填充功能。
所以我做了一些研究,发现了“外部助手-2”和选项:外部助手:真正的运行时助手:真。
它封装了babelHelpers中的每个babel功能,但是我不知道如何在我最后的生命中使用所有函数来生成对象。
编辑
如果我使用transform-运行时,就会在控制台中得到它。
将'babel-runtime/helpers/classCallCheck‘作为外部依赖处理’babel-运行时/帮助/createClass‘作为外部依赖-在options.globa ls中没有为外部模块’babel-运行时/帮助/classCallCheck‘提供名称-在options.globals中为外部模块’babel-运行时/助手/createClass‘提供了猜测'_classCallCheck’无名称-猜测'_createClass‘
另外,_classCallCheck和_createClass在最后的汇总生命中被添加到我的参数中。
发布于 2017-01-11 15:48:40
这就是我为rollup配置babel的方式,它可能适用于您:
{
presets : [['es2015', {"modules": false}]],
runtimeHelpers : true,
exclude : 'node_modules/**',
plugins : ["external-helpers"]
}如果非常,那么使用es2015而不是es2015-rollup很重要
发布于 2016-12-05 20:56:55
尝试从externalHelpers配置中删除Rollup.js和runtimeHelpers选项。es2015-rollup预置已经包含了帮助程序,所以仅仅使用它就足够了。
更新的Rollup.js配置:
export default {
entry: './src/js/core.js',
dest: './dist/output.js',
format: 'iife',
plugins: [babel({
presets: ["es2015-rollup"]
})],
treeshake: false,
useStrict: true
};https://stackoverflow.com/questions/40982712
复制相似问题