IT技术 - 如何在使用 webpack 捆绑 React 时禁用严格模式 - 吾爱随笔录

如何在使用 webpack 捆绑 React 时禁用严格模式

IT技术 reactjs webpack

2021-04-27 05:35:50

您好，我被我的应用程序卡住了，我的应用程序在所有其他浏览器中都没有问题，而不是在 IE 中它抛出错误

0x800a0416 - JavaScript runtime error: Multiple definitions of a property not allowed in strict mode

我已经在 webpack.config 中实现了加载器

  module: {
    loaders: [{
        test: /\.js?$/,
        exclude: /(node_modules|bower_components)/,
        loaders: ['babel'],
        include: path.join(__dirname, 'scripts')
    }]
}

和我的 Package.json 脚本包含"build": "./node_modules/.bin/webpack --config webpack.config.production.js --progress --profile --colors",用于构建包

如果我会明确地use strict从包中找到并删除它，那么它工作正常，那么我如何在使用 webpack 创建包时删除该严格模式

4个回答

如果您看到该错误，那么很可能您在代码库中的某个地方在同一对象上声明了多个属性。禁用闹钟只是解决了症状。

我发现如果我在 JSX 中声明重复的属性会弹出这个错误，例如在做<MyComponent className="foo" onClick={onClick} className="foobar" />或不小心复制其他一些属性时。

查找并修复实际错误，而不仅仅是抑制错误消息。IE 应该告诉您它发生在哪一行，查看那里的内容并找出哪个组件有问题应该不会太难。

查看这个包：https : //www.npmjs.com/package/babel-plugin-transform-remove-strict-mode

我一直在寻找一种方便的方法来摆脱，'use strict'而它似乎就是这样做的。

我在.babelrc文件中包含了黑名单选项，例如

 blacklist: ["useStrict"]

它工作正常。

你有几个方法可以解决这个问题，.babelrc因为你使用 webpack，所以在你的 webpack 或 webpack 中将module设置为 false

webpack.mix.js

module : {
        loaders : [
            {
                test: /\.js?/,
                include: APP_DIR,
                use: {
                    loader: 'babel-loader',
                    options: {
                        "presets": [
                            ['es2015', {modules: false}]
                        ],
                    }
                },
                exclude: /node_modules/
            },
        ]
    },

或 .babelrc

{
    "presets": [
        [
            "@babel/preset-env",
            {
                "debug": true,
                "modules": false,
                "forceAllTransforms": true,
                "useBuiltIns": "usage"
            }
        ]
    ]
}

其它你可能感兴趣的问题

上一篇如何在 React 功能组件中添加事件下一篇渲染不同的组件时无法更新组件（`App`）