rollupjs - babelHelpers对象未创建

问题描述:

我正在使用汇总和babel来转储一些ES6代码并将结果捆绑到单个文件中,但我遇到了一些与babelHelpers对象有关的问题。rollupjs - 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(); 

}()); 

所以你可以在我使用ES6类core.js看到。我希望babel只为所使用的对象添加polyfill。由于目前我只使用类,我希望巴贝尔只使用checkClassCall和其他功能的“类”功能工作。但它为我的最终捆绑添加了整个polyfill功能。

所以我做了一些研究,发现关于“外佣-2”和选项: externalHelpers:真 runtimeHelpers:真

其包内babelHelpers每一个通天的功能,但我不知道如何产生的在我的最终IIFE的顶部的所有功能的对象。

编辑

如果我使用变换运行然后我得到这个控制台

治疗“通天塔运行时/助理/ classCallCheck”外部依赖 治疗“通天塔运行时/助理/ createClass '作为外部依赖关系 options.globa ls - guessing'_classCallCheck' 没有为外部模块'babel-runtime/helpers/classCallCheck' options.globals - 猜“_createClass”

也_classCallCheck和_createClass添加到我的参数,最终汇总IIFE

+0

您是否尝试安装babel-plugin-transform-runtime?它应该持有你需要的帮手。 – misha130

+0

我尝试过。结果是添加了2个参数给我的IIFE _classCallCheck,_createClass,但这并不能解决我的问题。此外,_classCallCheck中已添加_classCallCheck ='default'? _classCallCheck ['default']:_classCallCheck; _createClass ='default'in _createClass? _createClass ['default']:_createClass; ...我希望Babel在我的IIFE的TOP处插入classCallCheck和createClass函数,而不是将它们作为外部参考 – Balbi

尝试从Rollup.js配置去除externalHelpersruntimeHelpers选项。 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 
}; 
+0

仍然不起作用。整个polyfill都包含在内......我只需要一些功能 – Balbi

这是我如何配置汇总的巴贝尔,可能会为你工作:

{ 
    presets  : [['es2015', {"modules": false}]], 
    runtimeHelpers : true, 
    exclude  : 'node_modules/**', 
    plugins  : ["external-helpers"] 
} 

如果是非常重要的是使用es2015代替es2015-rollup