gpt4 book ai didi

javascript - 将 JS 与 rollup 和 Babel 捆绑以在 IE11 中使用

转载 作者:行者123 更新时间:2023-12-03 21:49:08 25 4
gpt4 key购买 nike

我尝试捆绑两个 JavaScript 模块,以便生成的代码在 IE11 中工作。为此,我设置了一个 yarn/npm 项目,该项目使用 rollup.js 进行捆绑,使用 Babel 进行转译。一切正常,直到我添加(非开发)依赖 core-js .
这里有详细信息:
1 添加core-js前的设置
JS文件

  • src/main.js
  • src/utils.js

  • 配置文件
    包.json
    {
    "name": "rollup_for_ie",
    "devDependencies": {
    "@babel/core": "^7.11.1",
    "@babel/preset-env": "^7.11.0",
    "@rollup/plugin-babel": "^5.2.0",
    "@rollup/plugin-node-resolve": "^9.0.0",
    "rollup": "^2.24.0"
    },
    }
    rollup.config.js
    import resolve from '@rollup/plugin-node-resolve';
    import babel from '@rollup/plugin-babel';

    export default {
    input: 'src/main.js',
    output: {
    file: 'dist/main.js',
    format: 'iife'
    },
    plugins: [
    resolve({
    browser: true
    }),
    babel({
    exclude: "node_modules/**", // only transpile our source code
    babelHelpers: 'bundled'
    })
    ]
    };
    babel.config.js
    module.exports = {
    presets: [
    [
    "@babel/preset-env",
    {
    targets: {
    browsers: "> 0.5%, ie >= 11"
    },
    modules: false,
    spec: true,
    useBuiltIns: "usage",
    forceAllTransforms: true,
    corejs: 3
    }
    ]
    ],
    };
    当我运行 rollup -c我收到有关未解决依赖项的警告,但有一个捆绑文件 dist/main.js使用 src 目录中的(使用过的)东西生成。生成的文件甚至可以在 Chrome 等现代浏览器中使用。到目前为止,一切都很好。
    添加core-js后的问题
    但是,捆绑的文件还没有 IE11 准备好:在 IE 中,我收到诸如对象不支持属性或方法“getOwnPropertySymbols”之类的错误。所以需要添加来自 core-js 的 polyfill。
    为此,我将 core-js 安装为产品依赖项。现在 rollup -c没有给我警告 - 但结果 dist/main.js 开始像
    (function (exports) {
    'use strict';

    var $ = require('../internals/export');
    .
    .
    .
    作为脚本,Chrome 和 IE 都不能执行!看起来 core-js 库的存在以某种方式使汇总捆绑器关闭。
    如何修复我的设置,以便生成 dist/main.js在 Chrome 和 IE11 中作为非模块脚本工作?

    最佳答案

    我认为当您启用选项 useBuiltIns: "usage"这意味着它将附加来自 corejs 的代码到你用 cjs 编写的模块文件中风格。所以你必须添加这个插件@rollup/plugin-commonjs转换回 esm ,那么它将起作用:

    import commonjs from '@rollup/plugin-commonjs';

    export default {
    // ...
    plugins: [
    // ...
    commonjs(),
    ]
    };

    关于javascript - 将 JS 与 rollup 和 Babel 捆绑以在 IE11 中使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63407950/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com