内部NPM组件库报Module has no exports错误，无法导入组件

核心问题：导入方式不匹配 #

你的组件库通过export { default as SelectInput } from "./components/SelectInput"导出的是命名导出，但你在项目中使用了默认导入语法，这是触发错误的直接原因。

修正导入方式 #

将项目中的导入代码：

import SelectInput from 'ui-library';

修改为命名导入：

import { SelectInput } from 'ui-library';

若需一次性导入多个组件，可使用批量导入语法：

import { SelectInput, Button, DataTable } from 'ui-library';

额外配置检查点 #

如果修正导入后仍存在异常，依次检查以下内容：

1. Babel编译配置 #

你的babel配置中@babel/preset-env设置了modules: false，该配置会让Babel保留ES模块原生语法（import/export），但如果你的项目使用CommonJS模块系统（如Webpack旧版本、Node环境），可能导致导出识别失败。

尝试修改Babel配置，将modules改为'commonjs'：

"babel": {
  "presets": [
    [
      "@babel/preset-env",
      {
        "modules": "commonjs",
        "targets": {
          "node": "current"
        }
      }
    ],
    "@babel/preset-react"
  ]
}

修改后重新执行npm run compilePackage，重新打包发布组件库。

2. 编译后文件验证 #

从公司内部NPM源下载ui-library包并解压，查看lib/index.js文件，确认编译后的代码是否正确导出组件。正确的CommonJS导出格式应为：

exports.SelectInput = require("./components/SelectInput").default;

若编译后的文件无正确导出语句，说明编译流程存在问题，需检查babel-cli编译命令是否覆盖了所有源文件。

3. 组件自身导出检查 #

确认./components/SelectInput文件中确实使用默认导出：

// SelectInput.js
const SelectInput = () => { /* 组件逻辑 */ };
export default SelectInput;

若组件为命名导出，需同步调整库根目录index.js的导出语句。

内容的提问来源于stack exchange，提问作者jansyb04