reactjs - 属性类型 : Impact on bundle size?

Question

简单问题:

是PropTypes增加交付的 bundle 大小并且仅在开发模式下显示吗？

Answer 1

这取决于您如何构建项目。如果您使用webpack并将process.env.NODE_ENV设置为生产，则PropTypes不包括整个类型检查到你的包

您可以查看source code为了了解每个环境的 bundle 中将包含哪些内容。

if (process.env.NODE_ENV !== 'production') {
  var ReactIs = require('react-is');

  // By explicitly using `prop-types` you are opting into new development behavior.
  var throwOnDirectAccess = true;
  module.exports = require('./factoryWithTypeCheckers')(ReactIs.isElement, throwOnDirectAccess);
} else {
  // By explicitly using `prop-types` you are opting into new production behavior.
  module.exports = require('./factoryWithThrowingShims')();
}

factoryWithThrowingShims 只是为所有 PropTypes 方法提供垫片，以避免在生产环境中从 PropTypes 调用某些方法时代码中出现异常。这意味着仅当 process.env.NODE_ENV 不等于 product 时，才会包含 PropTypes/factoryWithTypeCheckers.js 中的整个代码。如果您需要完全(甚至Shims)，从代码中删除PropTypes，则需要使用一些 babel plugins .