Module not found: Error: Can't resolve './components'

Question

I created this custom React package: https://github.com/leongaban/leon-theme

npm i leon-theme

Next created a new basic create-react-app & installed styled-components

When I import this line into the new react app's index.js file I get the following error:

ERROR in ./node_modules/leon-theme/dist/index.js 7:21-44 Module not found: Error: Can't resolve './components' in '/Users/leongaban/Projects/test3/node_modules/leon-theme/dist'

What the custom package's compiled index.js looks like

'use strict';
Object.defineProperty(exports, "__esModule", {
 value: true
});
var tslib_1 = require("tslib");
tslib_1.__exportStar(require("./components"), exports);
//# sourceMappingURL=index.js.map

I downgraded react-scripts "react-scripts": "^4.0.2" but this didn't help.

At a loss atm, at first I was trying to solve a process is missing error, but just needed to install styled-components in the new react app. Now running into this Can't resolve error.

Package's tsconfig

{
 "compilerOptions": {
 "outDir": "./dist",
 "module": "nodenext",
 "target": "es5",
 "lib": ["es6", "dom"],
 "sourceMap": true,
 "allowJs": false,
 "jsx": "react",
 "moduleResolution": "nodenext",
 "rootDirs": ["src"],
 "baseUrl": ".",
 "esModuleInterop": true,
 "allowSyntheticDefaultImports": true,
 "strict": true,
 "declaration": true
 },
 "include": ["src/**/*"]
}

• Phil: Your dist/components directory doesn't have an index.js file (just index.d.ts). I would think for require("./components") to work, it would need an actual file
• Leon Gaban: There is a dist/index file actually, I just fixed my issue btw, I needed to remove "moduleResolution": "nodenext", and convert module back to es6 in the tsconfig
• Phil: Nice. You should add an answer below

Answer 1

So at first I was getting errors with missing process.

I updated my react-scripts to the latest, which I then had to fix by lowering to ^4.0.2, which actually resolved to ^4.0.3

Next I also changed the module and moduleResolution keys both to nodenext

This was what caused the problem with missing components.

After I completely removed moduleResolution this solved my issue.