Javascript 如何让webpack*实际上*忽略外部文件并依靠浏览器导入？

我试图让webpack忽略导入，以便浏览器使用本机ES6 import语句而不是webpack导入它。我正试图让ffmpeg.js直接导入，因为当它试图捆绑它时会崩溃webpack，因为文件太大

根据这里的答案（），我在本地树中的代码是/ffmpeg/ffmpeg-mpeg.js，并验证了我的开发服务器可以作为

然后，我通过以下方式导入：

  import ffmpeg from '/ffmpeg/ffmpeg-webm.js';

并将其添加到我的网页配置的外部部分：

  externals: {
    '/ffmpeg/ffmpeg-webm.js': 'ffmpeg',
  },

结果是一个如下所示的链接

webpack:///external "ffmpeg"

包含：

module.exports = ffmpeg;

然后失败，出现“未捕获错误：找不到模块？”（事实上，该错误是在生成的文件中硬编码的）

因此，这似乎假设有一个全局ffmpeg选项，然后将该模块映射到该模块，但我希望它完全不受webpack的影响，并将其留给浏览器

---

正确的方法是什么？在该页面上被否决的排除规则也不起作用。

您忘记在页面中包含外部脚本

另外，由于您指出您的文件非常大，我建议将其推迟

所以你需要加上

到应用程序的头部，然后使用带有回调的导入函数以稍微不同的方式导入它

import（'/ffmpeg/ffmpeg-webm.js'）。然后（ffmpeg=>{
//用ffmpeg做你想做的事
});

小提示：externals键不需要是文件的路径，它只是导入时要使用的名称，因此如果您对路径感到困惑，请重命名它

module.export={
//...
外部：{
“ffmpeg webm”：“ffmpeg”
}
}
//然后导入
导入（'ffmpeg-webm'）。然后（ffmpeg=>{
//用ffmpeg做你想做的事
});

或者，您可以使用

const ffmpeg = __non_webpack_require__('/ffmpeg/ffmpeg-webm.js')

---

请记住，这会将其转换为正常要求，仅在ES6是全局的情况下使用，即在

全局

或

窗口

对象上，您应该能够直接访问它，而无需导入它。例如

如果（！window.ffmpeg）{/*执行一些回退逻辑*/}

我认为这就是问题所在，ffmpeg不是全局的，它在通过import语句加载模块之前不存在。事实上，如果我读对了生成的代码，它看起来总是会出错，因为它在构建时没有找到全局模块。。您是否在应用程序的html中包含外部脚本？你需要这样做。（例如：

）但是如果我想通过脚本标签导入，我不需要import语句，如果从等式中删除webpack，ES6可以很好地导入该模块。我只需要告诉webpack忽略那个import语句，并将它原封不动地传递到生成的代码中，一切都会正常工作（并且不会试图捆绑它）是的，但您没有得到的是，将其从捆绑包中排除意味着您需要将其包含在Web包的html页面中，以便将其作为外部依赖项加载，然后才能导入。。那件事没办法解决。。你至少试过了吗？你也可以使用uuu non_webpack_require_uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu。因此，如果没有网页包代码，import语句就可以正常工作，如果没有任何额外的脚本标记，浏览器将找到import语句并加载/ffmpeg/ffmpeg-webm.js（我已经在一个非网页包的小示例中验证了这一点）。如果我想将其作为脚本组件而不是模块添加，我不需要import语句Yes you do。。。如果你想将其作为外部网页包模块导入，这就是关键所在，你将网页包导入与es6混淆，从你声明脚本为外部脚本的那一刻起，你必须以某种方式将其包含在网页包中，以便网页包在你的网页包应用程序中使用它，这种方式就是将其加载到网页上，网页包将其作为可导入的模块引用，您不能将其从捆绑包中排除，也不能同时对其进行imoorted