Error Could not resolve entry module React + Rollup

user_1326367 0
Viewed 2058

I need to build shareable React component which could be used across apps.

For this, I was/am following the below article

My Configuration looks exactly the same except the npm packages version (even tried with the same versions)

The folder structure looks the same as below

enter image description here

rollup.config.js

import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "@rollup/plugin-typescript";
import dts from "rollup-plugin-dts";

const packageJson = require("./package.json");

export default [
{
 input: "src/index.ts",
 output: [
  {
    file: packageJson.main,
    format: "cjs",
    sourcemap: true,
  },
  {
    file: packageJson.module,
    format: "esm",
    sourcemap: true,
  },
],
plugins: [resolve(), commonjs(), typescript({ tsconfig: "./tsconfig.json" })],
},
{
 input: "dist/esm/types/index.d.ts",
 output: [{ file: "dist/index.d.ts", format: "esm" }],
 plugins: [dts()],
},
];

npm script

"rollup": "rollup -c"

However when I run npm run rollup this throws the below error

[!] Error: Could not resolve entry module (dist/esm/types/index.d.ts).
Error: Could not resolve entry module (dist/esm/types/index.d.ts)

Please suggest. Thanks!

rollupjs reactjs
1 Answers

I also ran into the same problem you are experiencing when working with rollup. After spending some while digging for the solution, I finally got to solve this problem.

My Configuration looks exactly the same except the npm packages version (even tried with the same versions)

The exception you have stated is actually the problem. The problem lies in package versioning. The package @rollup/plugin-typescript versions later than 8.3.3 are not generating nor storing the declaration files in the types folder expected to be at the path: dist/cjs/ and dist/esm/.

The latest version at this point in time is 8.5.0 which still breaks. Hopefully it is fixed in near future.

Steps to fix your error

  • Make sure your tsconfig.json file has "declarationDir": "types" to direct the bundler's typescript plugin to create and store declaration files in the types folder when you run npm run rollup
  • Uninstall the existing @rollup/plugin-typescript package version by running npm un @rollup/plugin-typescript --save-dev
  • Install @rollup/plugin-typescript with the command npm i @rollup/plugin-typescript@8.3.3. As you see, we are picking a specific version.

If you still encounter problems:

  • Manually update the package.json file like: "@rollup/plugin-typescript": "8.3.3". Note that I have removed the caret(^) symbol to tie the package to version 8.3.3.
  • Delete the node_modules folder. You could use the command rm -rf node_modules.
  • Delete package-lock.json.
  • Run npm i to install the packages again with versions specified in package.json
user_119669060
Related