Having encountered this issue, I understand that it has been a common question on the internet. I apologize for potentially duplicating the query. Despite trying various solutions found online, none have proven to be effective.
The Problem: The problem arises when importing a package created with Rollup.js for React using Typescript. The error occurs when attempting to import and use any component from the package:
Compiled with problems:
×
ERROR in ./node_modules/clone-stats/index.js 1:11-30
Module not found: Error: Can't resolve 'fs' in 'C:\Users\User\Documents\test\node_modules\clone-stats'
ERROR in ./node_modules/css/lib/stringify/source-map-support.js 9:9-22
Module not found: Error: Can't resolve 'fs' in 'C:\Users\User\Documents\test\node_modules\css\lib\stringify'
... (more errors listed)Below is my package.json:
{
// Package JSON data here
}
Below is my rollup.config.js:
{
// Rollup configuration details here
}
Below is my config-overrides.js used with React-App-Rewired:
{
// Webpack configuration overrides here
}
Below is my tsconfig.json:
{
// TypeScript compiler configuration here
}
While everything functions correctly when utilizing components from my local directory, issues arise in two scenarios after packaging with Rollup:
- Testing the npm linked package and importing a component before running
npm start - Deploying the package to npm, installing it, and encountering errors upon importing a component before running
npm start
In both situations, the same error persists. Any assistance or insights would be highly valued.