javascript - Browserify 不捆绑 babel 模块

Question

在 gulp (v4) 中，我正在尝试使用 babel 为网站（也具有 es7 功能，例如Object.entries()）转换多个 es6 模块，并将它们与 browserify 捆绑在一起。由于某种原因，Browserify 似乎没有从 runtime-corejs 加载 babel polyfill。相反，这出现在我的输出文件中：

require("core-js/modules/es.object.to-string.js");

...

require("core-js/modules/es.string.match.js");


var _fromEntries = _interopRequireDefault(require("/absolutePathOnMyLocalMachineToMyProjectRoot/node_modules/@babel/runtime-corejs3/core-js/object/from-entries.js"));

...

var _entries = _interopRequireDefault(require("/absolutePathOnMyLocalMachineToMyProjectRoot/node_modules/@babel/runtime-corejs3/core-js/instance/entries.js"));

var _config = require("../config.js");

这导致TypeError: _entries.default(...) is undefined在运行时。我希望所有这些要求都已经加载？

由于我正在使用"useBuiltIns": "usage"，我目前没有在 index.js 文件的顶部导入 core-js 和 regenerator-runtime。然而，在导入它们并设置时，结果是相同的"seBuiltIns": "entry"。

问题

请有人指出如何配置 babel 和 browserify 以便在输出文件中包含所有必需的 polyfill，而不是在客户端浏览器中使用路径不可用的 require 语句？

我的配置和 gulp 任务如下。

吞咽 v4 任务

const jsLegacy = function () {
   return browserify({
       entries: "./src/index.js"
       })
       .transform(babelify)
       .bundle()
       .pipe(source( 'bundleIndex.js' ))
       .pipe(buffer())
       .pipe(gulp.dest("./dist/"))
}

babel.config.json

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "debug": true,
        "useBuiltIns": "usage",
        "corejs": 3,
        "modules": "commonjs"
      }
    ]
  ],
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "absoluteRuntime": true,
        "corejs": { "version": 3, "proposals": true },
        "helpers": true,
        "regenerator": true,
        "version": "^7.15.4"
      }
    ]
  ]
}

我的 package.json 的一部分

{

  "devDependencies": {
    "@babel/plugin-transform-runtime": "^7.15.0",
    "@babel/preset-env": "^7.15.6",
    "babelify": "^10.0.0",
    "browserify": "^17.0.0",
    "event-stream": "^4.0.1",
    "gulp": "^4.0.2",
    "gulp-babel": "^8.0.0",
    "vinyl-buffer": "^1.0.1",
    "vinyl-source-stream": "^2.0.0"
  },
  "dependencies": {
    "@babel/runtime": "^7.15.4",
    "@babel/runtime-corejs3": "^7.15.4",
    "core-js": "^3.18.1",
    "regenerator-runtime": "^0.13.9"
  }
}

标签： javascriptgulpbabeljsbrowserify