Rollup Error in pnpm-workspace monorepo:'default' is not exported by ../../node_modules/.pnpm/classnames#2.3.1/node_modules/classnames/index.js - rollupjs

Question

I have a UI lib repo , which could working well with below rollup config
My 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,
};
however , when i am using pnpm workspace and try to manage it inside , below error showing:
The Error I'm getting and don't know to solve
[!] 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.
the https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module page does not really help, since the namedExports has been no longer working.
"#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"
its a lib repo that integrated with antd. antd-mobile, which currently using React for UI development.

Answer 1

Try regex in rollup.config.js under plugins:
babel({
babelHelpers: "bundled",
exclude: /node_modules/, // add this
}),