Question

我创建了一个npm库，在这里我探索使用汇总来捆绑。这是配置：

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类型的声明，但是由于我已经在propup config中将prop类型声明为全局的，因此将其保留为依赖项。当我从全局变量中删除它时，它将解析该程序包并将其捆绑在最终版本中。我该怎么办？我的构建配置也是最佳选择创建iife，cjs和esm版本？

Answer 1

您可以将transform-react-remove-prop-types babel插件与选项removeImport: true一起使用。因此，此条件最终从构建中删除了prop-types。

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

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

1 个答案: