如何在 React Native 中分离生产和开发代码

Question

遗憾的是，我还没有找到任何正确的答案。

我目前正在开发一个带有 redux 的 react-native 应用程序，我发现发布版本被一些开发工具放慢

了速度。

下面是一个示例：

const store = createStore(
  Reducers,
  composeWithDevTools(
    applyMiddleware(thunk),
  ),
);

而这个composeWithDevTools显然是一些开发工具，release我应该使用另一个叫做 compose .我想做的是这样的：

//development
const store = createStore(
  Reducers,
  composeWithDevTools(
    applyMiddleware(thunk),
  ),
);
//production
const store = createStore(
  Reducers,
  composeWithDevTools(
    applyMiddleware(thunk),
  ),
);
//end

考虑到我的位置，它会自动选择正确的代码示例。（开发或发布）。

你们知道我可以用来做这个的工具吗？

提前致谢

Answer 1

您可以使用

__DEV__全局常量。此外，babel 编译器足够智能，可以完全删除由常量保护的代码，因此您还可以减小代码大小。

例如，我们使用此代码初始化存储：

function setupStore(extra = {}) {
  const middlewares = [thunk.withExtraArgument(extra)]
  if (__DEV__) {
    const createLogger = require('redux-logger').createLogger // redux-logger 3.x
    const logger = createLogger()
    middlewares.push(logger)
  }
  const store = createStore(reducer, applyMiddleware(...middlewares), autoRehydrate())
  return store
}

Answer 2

Redux Logger 不久前已更改。

现在您需要像这样导入： import { createLogger } from 'redux-logger';

在上面的示例中，您可以执行以下操作：

const { createLogger } = require('redux-logger');
const logger = createLogger();
middlewares.push(logger);