鉴于大多数浏览器现在都支持本机ES6模块并结合了HTTP / 2功能,因此可以在这些浏览器中加载未捆绑的ES6模块是可行的,但对于其他浏览器,使用脚本标签nomodule
属性可以作为备用。
基于此,我希望配置webpack来做到这一点;因此,除了进行通常的捆绑(例如产生app.bundle.js
之外),还将ES6模块复制到输出文件夹并更新导入网址(可以假设所有JS代码都使用本身就是ES6模块的导入-显然除非每个人都在npm中提供ES6模块软件包,否则commonJS / UMD的转译将是不错的选择。
我的想法是,webpack可以将这些导入的模块复制到输出文件夹(使用复制插件),同时更新导入网址,例如,如果我有:
import _ from "lodash-es";
Webpack应该将node_modules/lodash-es
文件夹复制到输出文件夹中的'modules'文件夹,并将导入内容重写为如下所示(输出位置显然是可配置的):
import _ from "./modules/lodash-es"
我没有看到任何解决此问题的简单方法(我只能想象,随着人们采用本机ES6模块,这种情况将变得越来越普遍);我将继续研究适合我需求的解决方案,并将在此处进行记录,但是如果那里有人对这个问题有有效的解决方案或指向该解决方案的链接,请告诉我们,因为我希望不是唯一尝试的人解决这个问题。
答案 0 :(得分:0)
花了很长时间尝试使某些东西正常工作,所以我决定暂时采用通常的捆绑方法。看看W3C标准如何解决ES6模块分辨率问题(我知道谷歌已经提出了映射文件)将会很有趣,我想一旦弄清楚了我们可能会看到针对此问题的解决方案。