"在反應生產構建中刪除控制台日志語句？"

Question

我有一個基本的反應應用程序（使用create react app 創建<\/strong>）
我已經瀏覽了一些相關的鏈接，例如 babel 插件安裝npm i babel-plugin-transform-remove-console --save<\/strong> Guide to remove console log using babel plugin<\/a>

 {
  "env": {
    "production": {
      "plugins": ["transform-remove-console"]
    }
  }
}

Answer 1

你可以在src/App.js嘗試這個，你的應用程序的根組件：

if (process.env.REACT_APP_STAGE === 'PROD')
  console.log = function no_console() {};

就在return之前。

Answer 2

您可以嘗試使用這些包來覆蓋配置：

注意：從react-app-rewired的文檔來看，這會破壞 CRA 提供的“保證”。 所以你在使用之前應該小心。

npm i -D customize-cra react-app-rewired babel-plugin-transform-remove-console

修改你的 package.json，將react-scripts替換為react-app-rewired除了reject 。 完成后，您的腳本應如下所示：

"scripts": {
 "start": "react-app-rewired start",
 "build": "react-app-rewired build",
 "test": "react-app-rewired test",
 "eject": "react-scripts eject"
}

然后創建一個文件：

touch config-overrides.js

// config-overrides.js
const { override, addBabelPlugins } = require('customize-cra')

module.exports = override(
  addBabelPlugins(
    "transform-remove-console"
  )
)

最后，運行npm run build ，所有console.log將被刪除。

另外，對於這個類似的問題，我還有另一個答案，您也可以查看其他答案。

Answer 3

@pmiranda 的解決方案應更改為：

if (process.env.NODE_ENV === "production")
    console.log = function no_console() {};