11，gulp和模块

Question

我正在开发一个项目，它使用eleventy (v1.0.2)和gulp (v4.0.2)和node (v16.17.0)。

我需要在gulpfile.js文件中使用的一些当前版本的gulpfile.js模块现在已经转换为Javascript模块，需要用import而不是require导入。然而，这使我进入了一个充满痛苦的世界。

gulp似乎无法处理ES6语法(使用import)，除非我将package.json更改为包含"type": "module"。但是，这对eleventy来说是致命的，它破坏了：

require() of ES Module /Users/user/blahblah/eleventy.js from
/Users/user/blahblah/node_modules/@11ty/eleventy/src/TemplateConfig.js
not supported.
[11ty] .eleventy.js is treated as an ES module file as it is a .js file
whose nearest parent package.json contains "type": "module" which
declares all .js files in that package scope as ES modules.

建议的解决办法：

Instead rename .eleventy.js to end in .cjs, change the requiring code
to use dynamic import() which is available in all CommonJS modules, 
or change "type": "module" to "type": "commonjs"

似乎帮不上忙。如果我将.eleventy.js重命名为.eleventy.cjs，那么它对eleventy就变得不可见了，而将package.json中的type更改为commonjs只会使我回到原来的gulp位置。

我尝试将gulpfile.js重命名为gulpfile.mjs，但这并没有帮助：gulp无法看到具有.mjs扩展名的文件。

一种选择是将我在Gulpfile中需要的模块删除回可以用require导入的旧版本，但在某些情况下，这些模块的早期版本是3年前的。所以这并不是一个好的解决方案。

似乎我可以通过安装babel转换程序并将我的Gulpfile编写为gulpfile.babel.js来解决这个问题。但在我看来，奇怪的是，在2022年，我仍然需要使用转移溢出来获得ES6语法；感觉应该有更好的方法。

我希望将来尽可能多地验证这个项目，所以理想情况下，我应该用ES6编写我的Gulpfile (理想情况下，我的所有eleventy代码)。但目前看来，这似乎不是一种选择(除非我使用转移溢出)。

我是否忽略或误解了什么，还是gulp和eleventy仍然在模块方面受到挑战？

ETA:转换不是答案，因为babel只会帮助每个import返回一个require，而那些坚持import编辑而不是required的模块会迅速崩溃。

Answer 1

在回答我自己的问题时，事实证明gulp能够毫无问题地处理.mjs文件，但是有一个最新版本的gulp-cli是至关重要的。

解决方案是将gulp-cli升级到2.3.0，然后将Gulpfile重命名为gulpfile.mjs并使用ES6语法。

不需要更改package.json中的package.json以使该解决方案工作，因此eleventy不受影响。然后，gulp和eleventy都可以通过适当的npm脚本启动。因此，例如，我可以定义：

"scripts": {
  "build": "gulp; npx @11ty/eleventy",
  "serve": "gulp; npx @11ty/eleventy --serve"
}

在我的package.json中启动一个完整的构建：

npm run build