转译的 webpack 包不会通过 require 导出带连字符的包名答案

【问题标题】：Transpiled webpack bundle does not export hyphenated package name via require转译的 webpack 包不会通过 require 导出带连字符的包名
【发布时间】：2023-03-22 13:43:01
【问题描述】：

我正在将fluent-ffmpeg 与：import ffmpeg from 'fluent-ffmpeg' 导入到一个文件中。

运行 webpack 后，我收到此错误： Uncaught Exception: ReferenceError: fluent is not defined

我查看了转译文件，发现 fluent-ffmpeg 包含如下： function(e,t){e.exports=fluent-ffmpeg}

将行更改为：function(e,t){e.exports=require("fluent-ffmpeg")} 后，程序运行。

有没有办法将 webpack 配置为在转译时正确要求 fluent-ffmpeg？

编辑：我正在使用这个电子反应 webpack 样板来构建一个桌面应用程序 - https://github.com/chentsulin/electron-react-boilerplate

更新： 我创建了一个 repo 来显示这个错误 - https://github.com/the4dpatrick/congenial-barnacle。 electron-react-boilerplate 和这个 repo 之间的区别可以在 single commit 中看到

查看错误：

npm i
打包电子应用 (npm run package)
打开发布目录下的应用程序。
警报打开时出错

【问题讨论】：

你要关闭开头的'吗？即import ffmpeg from 'fluent-ffmpeg'
是的，甚至将行更改为 const ffmpeg = require("fluent-ffmpeg") 也会产生相同的结果。编辑：在问题中我只是有一个错字，我遗漏了尾随'
Webpack 是一个客户端模块捆绑器，即使您设法创建了捆绑包，它也无法在浏览器上运行，因为 fluent-ffmpeg 使用节点的 os 和 child_process 模块，我说得对吗?
@MauricioPoppe 我正在使用这个电子反应样板 - github.com/chentsulin/electron-react-boilerplate。它适用于桌面应用程序

标签： javascript node.js ecmascript-6 webpack fluent-ffmpeg

【解决方案1】：

我可以通过简单地将output.libraryTarget 设置within webpack.config.electron.js 文件设置为commonjs2 来解决这个问题。

output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js',
    libraryTarget: 'commonjs2'
  },

更多详情请阅读：chentsulin/electron-react-boilerplate#232

【讨论】：

文件webpack.config.electron.js应该放在哪里？可以在webpack.config.base.js 中设置吗？