如何禁用加载React Devtools后端脚本

Question

在生产环境中，react_devtools_backend.js正在加载，这会减慢我的网站在生产环境中的运行速度。如何禁用加载此react devtools？我使用的是react 16.8，reactSSR，webpack 4.29，阿波罗

我已经用过了

 new webpack.DefinePlugin({
      '__REACT_DEVTOOLS_GLOBAL_HOOK__': '({ isDisabled: true })'
    }),

和

if (typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === "object") {
    for (let [key, value] of Object.entries(window.__REACT_DEVTOOLS_GLOBAL_HOOK__)) {
        window.__REACT_DEVTOOLS_GLOBAL_HOOK__[key] = typeof value == "function" ? ()=>{} : null;
    }
}

和

<script>
        if (typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === 'object') {
            __REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function() {};
        }
</script>

还有这个

const disableReactDevTools = (): void => {
    const noop = (): void => undefined;
    const DEV_TOOLS = (window as any).__REACT_DEVTOOLS_GLOBAL_HOOK__;

    if (typeof DEV_TOOLS === 'object') {
        for (const [key, value] of Object.entries(DEV_TOOLS)) {
            DEV_TOOLS[key] = typeof value === 'function' ? noop : null;
        }
    }
};

有什么想法吗？

Answer 1

不确定这是否是你正在寻找的答案，但它似乎是由于安装了扩展而加载的。

当我打开一个隐身窗口时，它没有装弹。

Answer 2

它是从chrome扩展加载的: React Developer Tools你可以去Network标签页，找到冗余脚本(点击它)。然后，您可以转到“Initiator”选项卡-在那里您将看到它的来源。

​

​