如何从生产汇总构建中删除 React PropTypes？

Question

我创建了一个 npm 库，正在其中探索使用 rollup 进行捆绑。这是配置：

import babel from 'rollup-plugin-babel';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
import { terser } from 'rollup-plugin-terser';
import { sizeSnapshot } from 'rollup-plugin-size-snapshot';
import pkg from './package.json';

const input = 'src/index.js';
const name = 'TooltipTrigger';
const globals = {
  react: 'React',
  'react-dom': 'ReactDOM',
  'prop-types': 'PropTypes',
  'react-popper': 'ReactPopper'
};
const external = id => !id.startsWith('.') && !id.startsWith('/');
const getBabelOptions = ({ useESModules = true } = {}) => ({
  exclude: 'node_modules/**',
  runtimeHelpers: true,
  plugins: [['@babel/plugin-transform-runtime', { useESModules }]]
});

export default [
  {
    input,
    output: {
      name,
      file: 'dist/react-popper-tooltip.js',
      format: 'iife',
      globals
    },
    external: Object.keys(globals),
    plugins: [
      resolve({
        browser: true,
        modulesOnly: true
      }),
      commonjs({
        include: 'node_modules/**'
      }),
      babel(getBabelOptions()),
      sizeSnapshot()
    ]
  },
  {
    input,
    output: {
      name,
      file: 'dist/react-popper-tooltip.min.js',
      format: 'iife',
      globals
    },
    external: Object.keys(globals),
    plugins: [
      resolve({
        browser: true,
        modulesOnly: true
      }),
      commonjs({
        include: 'node_modules/**'
      }),
      babel(getBabelOptions()),
      terser(),
      sizeSnapshot()
    ]
  },
  {
    input,
    output: { file: pkg.main, format: 'cjs' },
    external,
    plugins: [babel(getBabelOptions({ useESModules: false })), sizeSnapshot()]
  },
  {
    input,
    output: { file: pkg.module, format: 'esm' },
    external,
    plugins: [babel(getBabelOptions()), sizeSnapshot()]
  }
];

我想从 IIFE 构建中的 prod 构建中删除 prop 类型。很好地删除babel-plugin-transform-react-remove-prop-types了 prop 类型声明，但由于我已在汇总配置中将 prop-types 声明为全局，因此它将其保留为依赖项。当我从全局变量中删除它时，它会解析该包并将其捆绑在最终构建中。我应该在这里做什么？另外，我的构建配置对于创建 iife、cjs 和 esm 构建来说是否是最佳的？

Answer 1

您可以将transform-react-remove-prop-typesbabel 插件与 options 一起使用removeImport: true。所以这个条件最终从构建中删除了 prop-types。

['transform-react-remove-prop-types', { removeImport: true }]例如。