Javascript 当React JS被缩小用于生产时，如何剥离测试代码？

在我的React功能组件中，我使用

useffect

来执行一些调试日志记录，但我只希望在非

--生产版

构建中运行它

// something like
if (process.env.NODE_ENV !== 'production') {
  // I want the contents of this block removed on production builds, but it is inside a function
  useEffect(() => {
    console.log("authState changed", AuthStates[authState]);
  }, [authState]);

  useEffect(() => {
    console.log("authToken changed", authToken);
    if (tokenExpiresOn) {
      console.log(
        `token expires in ${(tokenExpiresOn - Date.now()).toLocaleString()}ms`
      );
    }
  }, [authToken]);

  useEffect(() => {
    if (tokenExpiresOn) {
      console.log(
        `token expires in ${(tokenExpiresOn - Date.now()).toLocaleString()}ms`
      );
    } else {
      console.log("tokenExpiresOn cleared");
    }
  }, [tokenExpiresOn]);
}

---

不能有条件地声明钩子。您可以在顶层声明，也可以将业务逻辑放入钩子中，例如下面的钩子

useEffect(() => {
   if (process.env.NODE_ENV !== 'production'){
    console.log("authToken changed", authToken);
    if (tokenExpiresOn) {
      console.log(
        `token expires in ${(tokenExpiresOn - Date.now()).toLocaleString()}ms`
      );
    }
 }
  }, [authToken]);

---

看起来像是一个很好的自定义钩子用例，但它是否会从缩小的代码中删除它？因为它永远不会到达那个路径？@ArchimedesTrajano，它将是代码的一部分，但在符合条件之前不会执行。好的，我的问题是确保它从缩小的输出中剥离出来。看看这个线程，有没有一套具体的指令来说明如何将它与ReactJS构建集成？