【问题标题】:Module not found: Can't resolve 'cluster' when using @rollup/plugin-json未找到模块:使用 @rollup/plugin-json 时无法解析“集群”
【发布时间】:2021-07-05 21:00:31
【问题描述】:

我正在开发一个使用 Babel+TypeScript 的 React 组件库,并且我正在使用 Rollup 创建包,然后我从 React 应用程序中导入组件。

在我将json()@rollup/plugin-json 添加到我的plugins 之前,一切正常。添加后,我最终收到一条错误消息:

Uncaught Error: Cannot find module 'cluster'

删除此插件后,构建工作再次开始,但我无法像这样进行 JSON 导入

import config from './config.json'

在我的库代码中。为了能够从 React 组件库中使用这个插件或 JSON 导入,我需要做些什么额外的事情吗?任何提示将不胜感激!


我的汇总配置:

import peerDepsExternal from 'rollup-plugin-peer-deps-external';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import babel from '@rollup/plugin-babel';
import json from '@rollup/plugin-json';
import pkg from './package.json';

const extensions = ['.js', '.jsx', '.ts', '.tsx'];

export default [
    {
        input: 'src/index.ts',
        output: [
            {
                format: 'cjs',
                file: pkg.main,
                sourcemap: true
            },
            {
                format: 'es',
                file: pkg.module,
                sourcemap: true
            }
        ],
        plugins: [
            peerDepsExternal(),
            resolve({ extensions }),
            commonjs(),
            babel({
                extensions,
                babelHelpers: 'runtime',
                exclude: ['node_modules/**']
            }),
            json() // This is the problematic line
        ]
    }
];

我的依赖版本:

{
    "devDependencies": {
        "@babel/core": "^7.13.14",
        "@rollup/plugin-babel": "^5.3.0",
        "@rollup/plugin-commonjs": "^18.0.0",
        "@rollup/plugin-json": "^4.1.0",
        "@rollup/plugin-node-resolve": "^11.2.1",
        "react": "^16.8",
        "react-dom": "^16.8",
        "rollup": "^2.44.0",
        "rollup-plugin-peer-deps-external": "^2.2.4",
        "typescript": "^4.2.3"
    }
}

【问题讨论】:

    标签: reactjs rollup rollupjs


    【解决方案1】:

    我在使用 @rollup/plugin-json 插件时遇到了同样的问题,我强烈建议您将 JSON 配置更改为简单的 ts 文件:

    import config from './config';
    

    你的文件是这样的:

    const config = {
      // ...
    };
    
    export default config;
    

    另外,我强烈推荐你使用tsdx 来创建你的库包,它可以节省你很多时间。使用 tsdx 创建一个新库,然后将所有代码迁移到这个很棒的零配置 TypeScript 包开发。


    【讨论】:

      猜你喜欢
      • 2019-12-26
      • 2023-01-15
      • 2021-07-17
      • 2018-04-17
      • 2018-10-01
      • 2021-10-16
      • 2022-08-07
      • 2019-07-29
      • 1970-01-01
      相关资源
      最近更新 更多