IE11 Svelte/Babel/Rollup中的Function.prototype.toString问题 [英] Function.prototype.toString issues in IE11 Svelte/Babel/Rollup

问题描述

我当前的rollup.config.js是

My current rollup.config.js is

    commonjs(),
    babel({
                extensions: ['.js', '.mjs', '.html', '.svelte'],
                runtimeHelpers: true,
                exclude: ['node_modules/@babel/**', 'node_modules/core-js/**' ], // <= /!\ NOT 'node_mobules/**'
                presets: [
                    ['@babel/preset-env', {
                    // adapter to ensure IE 11 support
                    targets: '> 0.25%, not dead, IE 11',
                    "modules": false,
                    "spec": true,
                    "forceAllTransforms": true,
                    useBuiltIns: 'usage',
                    corejs: 3
                    }]
                ],
                plugins: [
                    '@babel/plugin-syntax-dynamic-import',
                    [
                        '@babel/plugin-transform-runtime',
                        {
                            useESModules: true
                        }
                    ]
                ]
              })

在IE11中遇到问题:

Getting issue in IE11:

Function.prototype.toString:此"不是Function对象

Function.prototype.toString: "this" is not a Function object

如何正确解决该问题?

我试图

• 将 webcomponents 导入到我的main.js中:

• import webcomponents into my main.js:

导入'node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js';

import 'node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js';

但是此文件未导入:

未解决的依赖项 https://rollupjs.org/指南/zh/#warning-treating-module-as-external-dependency node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js(由src \ main.js导入)

Unresolved dependencies https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js (imported by src\main.js)

这意味着我必须配置解决插件，但这似乎是错误的方式，因为它被标记为非-然后使用.

This means i have to config resolve-plugin but it seems to be incorrect way because it is marked as non-used then.

推荐答案

正确运行rollup.config

Correctly working rollup.config

commonjs(),
babel({
    extensions: ['.js', '.mjs', '.html', '.svelte'],
    runtimeHelpers: true,
    exclude: ['node_modules/@babel/**', 'node_modules/core-js/**' ], 
    presets: [
        ['@babel/preset-env', {
        targets: {
            browsers: [
                "> 0.25%"
                ,"not dead"
                ,"IE 11"
            ]
        },
        "modules": false,
        "spec": true,
        "forceAllTransforms": true,
        useBuiltIns: 'usage',
        corejs: 3
        }]
    ],
    plugins: [
        '@babel/plugin-syntax-dynamic-import',
        [
            '@babel/plugin-transform-runtime',
            {
                useESModules: true
            }
        ]
    ]
}),
polyfill(['@webcomponents/webcomponentsjs'])

polyfill是 rollup-plugin-polyfill

the polyfill one is rollup-plugin-polyfill

这篇关于IE11 Svelte/Babel/Rollup中的Function.prototype.toString问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！