• 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧

Webpack将ES6编译成模块

ecmascript-6 来源:kartsims 4次浏览

我想将ES6编译为使用Webpack的文件,但无法弄清楚为什么代码不可用。Webpack将ES6编译成模块

边注:这是为了对VueJS

一个插件,我开始用一个简单的文件导出一个单一的功能,如

exports.install =() => { 
    ... 
} 

的WebPack使用babel-loaderbabel-preset-es2015到编译它。

您可能会在this gist中找到webpack配置,源文件和编译文件。

我的问题是结果是不是在我的VUE应用程序“requirable”…它有一些奇怪的东西围绕核心需要exports.install声明。当我删除所有这些东西,只留下exports.install = ...这是好的,否则我只是没有得到任何东西。

我在通过import语句构建的另一个使用webpack的应用程序中使用它。

===========解决方案如下:

如果没有output.libraryTarget选项,会的WebPack产生一束你可以通过<script>标签,但不import包括。我认为这是你所看到的。

如果你想import(或require)您的WebPack构建的结果,你应该设置libraryTargetcommonjs2

output: { 
    filename: 'index.js', 
    libraryTarget: "commonjs2" 
    }, 

有了这个libraryTarget配置,的WebPack输出如下module.exports = /* ... the "weird stuff" */,所以当你进口它,你会得到你期望的导出函数。


如果你正在做的是编译单个文件或设置将在其他的WebPack构建导入的文件,你可能会考虑不使用的WebPack可言的,而不是直接Babel CLI使用。在你的Gist中,除了将你的模块封装在一些额外的webpack引导代码中之外,你不会从webpack获得任何东西。


版权声明:本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系管理员进行删除。
喜欢 (0)