当前位置: 首页 > 知识库问答 >
问题:

javascript - 使用rollup打包,希望通过babel转译node_modules中的代码,但是没有生效?

缪阎宝
2024-10-07

rollup.config.mjs中的babel配置如下:

babel({
      extensions: ['.js', '.jsx', '.mjs'],
      presets: ['@babel/preset-env'],
      babelHelpers: 'runtime',
      include: ['src/**/*', 'node_modules/@xyflow/**/*'],
    }),

babel.config.json的配置如下:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "modules": false,
        "useBuiltIns": "usage",
        "corejs": "3",
        "targets": {
          "ie": 11
        }
      }
    ],
    "@babel/preset-react"
  ],
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "corejs": 3,
        "helpers": true,
        "regenerator": true,
        "babelHelpers": "runtime"
      }
    ],
    ["@babel/plugin-proposal-class-properties"],
    ["@babel/plugin-proposal-nullish-coalescing-operator"]
  ]
}

我希望达到的效果是将@xyflow包中的“??”语法转换,按照上面的配置打包后,文件中依旧包含“??”语法,希望各位大佬解惑

"rollup": "4.22.5",
"@babel/core": "7.25.2",
    "@babel/plugin-proposal-class-properties": "7.18.6",
    "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
    "@babel/plugin-transform-react-jsx": "7.25.2",
    "@babel/plugin-transform-runtime": "7.25.4",
    "@babel/preset-env": "7.25.4",
    "@babel/preset-react": "7.24.7",
    "@babel/runtime-corejs3": "7.25.6",

共有1个答案

洪通
2024-10-07

你遇到的问题应该与配置设置有关。

检查在babel.config.json中,配置能够正确处理nullish coalescing operator。检查插件@babel/plugin-proposal-nullish-coalescing-operator是最新版本,并且在Babel的执行过程中被正确加载。

rollup.config.mjs中,include选项应该确保Babel能够处理node_modules/@xyflow/**/*中的文件。考虑添加exclude: 'node_modules/**'避免不必要的转译。

babel({
  extensions: ['.js', '.jsx', '.mjs'],
  presets: ['@babel/preset-env'],
  babelHelpers: 'runtime',
  include: ['src/**/*', 'node_modules/@xyflow/**/*'],
  exclude: 'node_modules/**'
}),

确认Babel配置中的useBuiltIns: "usage"能够正确引入polyfills。考虑显式安装引入 core-js

npm install core-js

并在入口文件引入

import "core-js/stable";
import "regenerator-runtime/runtime";

确认所有相关依赖项(比如Rollup, Babel和一些插件)的版本兼容性。

考虑启用调试输出,
或者考虑手动测试,创建一个文件,使用??语法,检查打包后的文件。

 类似资料:
  • java主页: C:\users\satish.marathe>set java_home java_home=C:\construction\tools\IBM_SDK80 java版本给我: Edit1: 我忘了包含Maven-version的输出,所以这里是: C:>MVN-版本Apache Maven 3.2.5(12A6B3ACB947671F09B81F49094C53F426D8CE

  • 在使用rollup+babel打包es6代码做polyfill生成兼容老IE版本的代码时,polyfill未生效,报Unresolved dependencies警告。 我谷歌和参考过 https://segmentfault.com/q/1010000042335568 配置 @rollup/plugin-node-resolve 还是未成功,希望有大佬帮忙看看非常感谢,示例仓库demo地址如下

  • 通过vite中rollup打包,如何对lodash做按需打包? 这两种写法在build时 第一种dist体积比第二种要大。都说是第一种写法是将整个lodash打包进了dist。我这里有一个疑问,rollup在build时不是会对代码做按需打包吗? rollup的树摇不会起作用吗? 假设整个项目只使用了一个throttle函数,也会将整个lodash打包到dist吗? 虽然lodash是 cjs规范

  • 通过rollup打包test.js,打包后文件中出现Symbol关键字 源文件:test.js 打包后文件:test.min.js rollup配置文件:rollup.config.js 期望能够不生成Symbol.toPrimitive或者生成Symbol的polyfill。能在不支持ES6环境正常运行

  • 问题内容: 我用es6编写了一个模块,然后发布到npm,我想在另一个项目中使用它,所以我这样输入: 但这没有用: 这是我在webpack中的js加载器配置: 当我尝试导入非的模块时,babel效果很好。但是从导入模块,babel似乎不起作用? 问题答案: 请参阅babel文档: 注意:默认情况下,对node_modules的所有要求都将被忽略。您可以通过传递忽略正则表达式来覆盖它。 通常期望的是,

  • 我想在1.6级编译。我使用蚂蚁构建脚本。 蚂蚁记录指令。输出如下: 我发现以下错误: javac-target 1.6-source 1.6在命令行中按预期工作。 以下是对这个问题的回答: 引导类加载器堆栈溢出 从最终目标机器获取rt.jar。bootclasspath必须以某种方式指向这个rt.jar。