Babel.js SCRIPT5022:抛出异常且未捕获

tquggr8v  于 2022-12-16  发布在  Babel
关注(0)|答案(3)|浏览(369)

我正在为我的web项目使用Vuejs。因为有一些用户还在使用IE11,我需要使这个web项目兼容。
目前,我在IE11上遇到此错误:
SCRIPT5022:抛出异常且未捕获

/***/ "./node_modules/core-js/internals/internal-state.js":
/*!**********************************************************!*\
  !*** ./node_modules/core-js/internals/internal-state.js ***!
  \**********************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {

var NATIVE_WEAK_MAP = __webpack_require__(/*! ../internals/native-weak-map */ "./node_modules/core-js/internals/native-weak-map.js");

var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js/internals/global.js");

var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js/internals/is-object.js");

var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js/internals/create-non-enumerable-property.js");

var objectHas = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js/internals/has.js");

var sharedKey = __webpack_require__(/*! ../internals/shared-key */ "./node_modules/core-js/internals/shared-key.js");

var hiddenKeys = __webpack_require__(/*! ../internals/hidden-keys */ "./node_modules/core-js/internals/hidden-keys.js");

var WeakMap = global.WeakMap;
var set, get, has;

var enforce = function enforce(it) {
  return has(it) ? get(it) : set(it, {});
};

var getterFor = function getterFor(TYPE) {
  return function (it) {
    var state;

    if (!isObject(it) || (state = get(it)).type !== TYPE) {
      throw TypeError('Incompatible receiver, ' + TYPE + ' required');
    }

    return state;
  };
};

故障线路是

throw TypeError('Incompatible receiver, ' + TYPE + ' required');

我希望通过使用polyfills来避免不正确的行为。
这是webpack.mix.js

const {EnvironmentPlugin} = require ('webpack');
const mix = require ('laravel-mix');
const glob = require ('glob');
const path = require ('path');
const {CleanWebpackPlugin} = require ('clean-webpack-plugin');
const ChunkRenamePlugin = require ('webpack-chunk-rename-plugin');

require ('laravel-mix-tailwind');
require ('laravel-mix-purgecss');
require('laravel-mix-polyfill');

mix.webpackConfig ({
    output: {
        chunkFilename: 'js/chunks/[name].[chunkhash].js'
    },
    plugins: [
        new CleanWebpackPlugin ({
            cleanOnceBeforeBuildPatterns: ['chunks/**/*']
        }),
        new EnvironmentPlugin ({
            BASE_URL: '/'
        }),
        new ChunkRenamePlugin ({
            initialChunksWithEntry: true,
            '/js/app': 'js/main.js',
            '/js/vendor': 'js/vendor.js',
        }),
    ],
    module: {
        rules: [
            {
                test: /node_modules(?:\/|\\).+\.js$/,
                loader: 'babel-loader',
                options: {
                    presets: [['@babel/preset-env', {targets: 'last 2 versions, ie >= 10'}]],
                    plugins: ['@babel/plugin-transform-destructuring', '@babel/plugin-proposal-object-rest-spread', '@babel/plugin-transform-template-literals'],
                    babelrc: false
                }
            },
            {
                enforce: 'pre',
                test: /\.(js|vue)$/,
                loader: 'eslint-loader',
                exclude: /node_modules/
            }
        ]
    },
    resolve: {
        alias: {
            '@': path.join (__dirname, 'resources'),
            'node_modules': path.join (__dirname, 'node_modules')
        }
    },
});

mix.js ('resources/js/main.js', 'public/js')
.postCss ('resources/css/app.css', 'public/css')
.tailwind ('./tailwind.config.js')
.polyfill({
    enabled: true,
    useBuiltIns: "entry",
    targets: "> 0.25%, not dead"
})

你知道我该怎么解决这个问题吗?

pxy2qtax

pxy2qtax1#

我知道现在回应有点晚了,我最近也遇到了同样的问题,我是这样解决的:
异常中的消息是知道它是否是任何API的问题的关键。在这种情况下,它发生在我的符号上。
If you want to see the message in console, you can click here
我在core-js上添加polyfills时遇到了问题,但错误依然存在,我使用了https://polyfill.io上的polyfills,一切正常。
我把脚本放在index.html的头部,一切都很顺利。

<script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=fetch%2Cdefault"></script>

babel配置我只添加了字符串形式的预置和插件,没有配置其他任何东西,在webpack.config中我只添加了babel加载程序

{
  "presets": [
    "@babel/preset-react",
    "@babel/preset-env"
  ],
  "plugins": ["@babel/plugin-proposal-class-properties"]
}

如果你有任何问题,我会很留意的,谢谢你,我希望这个答复可以给予你知道可能发生的事情。
你好!

z9ju0rcb

z9ju0rcb2#

对我来说,解决方法如下:
import 'core-js/stable';添加到多边形填充.ts(js)文件中。

gev0vcfq

gev0vcfq3#

我的问题是我也在webpack规则中翻译core-js模块。更多细节在这个线程https://github.com/zloirock/core-js/issues/514
这解决了我的问题exclude: /@babel(?:\/|\\{1,2})runtime|core-js/,

module: {
   rules: [
            {
                test: /\.(js|jsx)$/,
                exclude: /@babel(?:\/|\\{1,2})runtime|core-js/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: [
                            ['@babel/preset-env', {
                                targets: {
                                    browsers: [
                                        "last 2 versions",
                                        "IE >= 11"
                                    ]
                                }
                            }],
                            '@babel/preset-react'
                        ],
                        plugins: [ '@babel/plugin-transform-arrow-functions', '@babel/plugin-proposal-class-properties' ]
                    }
                }
            },
     ...
          ]

相关问题