1

我有一个 UI lib repo ，它可以很好地与下面的汇总配置一起使用

我的 rollup.conf.js

import babel from '@rollup/plugin-babel';
import commonjs from '@rollup/plugin-commonjs';
import json from '@rollup/plugin-json';
import postcss from 'rollup-plugin-postcss';
import { nodeResolve } from '@rollup/plugin-node-resolve';
import { terser } from 'rollup-plugin-terser';
import typescript from 'rollup-plugin-typescript2';
import { DEFAULT_EXTENSIONS } from '@babel/core';

const isProd = process.env.NODE_ENV === 'production';

const pkg = require('./package.json');

const dependencies = Object.keys(pkg.peerDependencies);

export default {
  input: './components/index.ts',
  output: [
    {
      format: 'umd',
      name: pkg.name,
      file: 'lib/index.main.js',
      globals: {
        antd: 'antd',
        'antd-mobile': 'antd-mobile',
        react: 'react',
        'react-dom': 'react-dom',
        'styled-components': 'styled-components',
      },
    },
    {
      format: 'es',
      name: pkg.name,
      file: 'lib/index.module.js',
      globals: {
        antd: 'antd',
        'antd-mobile': 'antd-mobile',
        react: 'react',
        'react-dom': 'react-dom',
        'styled-components': 'styled-components',
      },
    },
  ],
  onwarn: function (warning) {
    if (warning.code === 'CIRCULAR_DEPENDENCY') {
      return;
    }
    if ( warning.code === 'THIS_IS_UNDEFINED' ) { return; };
    console.error(`(!) ${warning.message}`);
  },
  plugins: [
    typescript({
      include: ['*.ts+(|x)', '**/*.ts+(|x)'],
      exclude: 'node_modules/**',
      typescript: require('typescript'),
    }),
    babel({
      exclude: 'node_modules/**',
      babelHelpers: 'runtime',
      extensions: [...DEFAULT_EXTENSIONS, '.ts', 'tsx'],
    }),
    nodeResolve({
      mainField: ['jsnext:main', 'browser', 'module', 'main'],
      browser: true,
    }),
    commonjs(),
    json(),
    postcss({
      // Minimize CSS, boolean or options for cssnano.
      minimize: isProd,
      // Enable sourceMap.
      sourceMap: !isProd,
      // This plugin will process files ending with these extensions and the extensions supported by custom loaders.
      extensions: ['.less', '.css'],
      use: [['less', { javascriptEnabled: true, modifyVars: { '@primary-color': '#42b983' } }]],
    }),
    isProd && terser(),
  ],
  external: dependencies,
};

但是，当我使用 pnpm 工作区并尝试在内部管理它时，显示以下错误：

我遇到的错误，不知道如何解决

[!] Error: 'default' is not exported by ../../node_modules/.pnpm/classnames@2.3.1/node_modules/classnames/index.js, imported by ../../node_modules/.pnpm/antd@4.16.13_react-dom@16.13.1+react@16.13.1/node_modules/antd/es/empty/index.js
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
../../node_modules/.pnpm/antd@4.16.13_react-dom@16.13.1+react@16.13.1/node_modules/antd/es/empty/index.js (18:7)
16: 
17: import * as React from 'react';
18: import classNames from 'classnames';
           ^
19: import { ConfigContext } from '../config-provider';
20: import LocaleReceiver from '../locale-provider/LocaleReceiver';
Error: 'default' is not exported by ../../node_modules/.pnpm/classnames@2.3.1/node_modules/classnames/index.js, imported by ../../node_modules/.pnpm/antd@4.16.13_react-dom@16.13.1+react@16.13.1/node_modules/antd/es/empty/index.js
    at error (/Users/yejinlei/Documents/playground/personal/pnpm-workspace/node_modules/.pnpm/rollup@2.57.0/node_modules/rollup/dist/shared/rollup.js:158:30)
    at Module.error (/Users/yejinlei/Documents/playground/personal/pnpm-workspace/node_modules/.pnpm/rollup@2.57.0/node_modules/rollup/dist/shared/rollup.js:12339:16)
    at Module.traceVariable (/Users/yejinlei/Documents/playground/personal/pnpm-workspace/node_modules/.pnpm/rollup@2.57.0/node_modules/rollup/dist/shared/rollup.js:12724:29)
    at ModuleScope.findVariable (/Users/yejinlei/Documents/playground/personal/pnpm-workspace/node_modules/.pnpm/rollup@2.57.0/node_modules/rollup/dist/shared/rollup.js:11517:39)

 ELIFECYCLE  Command failed with exit code 1.

https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module页面并没有真正的帮助，因为 namedExports 已不再工作。

    "@babel/core": "^7.12.9",
    "@rollup/plugin-babel": "^5.2.2",
    "@rollup/plugin-commonjs": "^17.0.0",
    "@rollup/plugin-json": "^4.1.0",
    "@rollup/plugin-node-resolve": "^11.0.0",
    "rimraf": "3.0.2",
    "rollup-plugin-postcss": "^4.0.1",
    "rollup-plugin-terser": "^7.0.2",
    "rollup-plugin-typescript2": "^0.30.0",
    "tslib": "^2.0.3",
    "typescript": "^4.1.2"

它是一个与 antd 集成的 lib repo。antd-mobile，目前使用 React 进行 UI 开发。

4

0 回答 0