As I attempt to release a TS package to NPM with both CommonJs and esm, I encounter two issues. 1- The challenge of building the esm files as .mjs files persists. As a temporary solution, I manually edit the file extensions before publishing to npm. Feedback on this approach would be greatly appreciated. 2- Importing from the package raises an error when accessing any file other than the main one:
Cannot find module 'nizar-npm-publish-test/mult/multiply' or its corresponding type declarations.ts(2307)The structure of my TS package is as follows:
- root/index.ts // includes add function with export default
- root/substract.ts // contains substract function with export default
- root/package.json
- root/tsconfig.json
- root/tsconfig.types.prod.json
- root/mult/multiply.ts // features multiply function with export default
- root/mult/divide.ts // comprises divide function with export default This is how my build is organized:
- build/@types/index.d.ts
- build/@types/substract.d.ts
- build/@types/mult/multiply.d.ts
- build/@types/mult/divide.d.ts
- build/cjs/index.js
- build/cjs/substract.js
- build/cjs/mult/multiply.js
- build/cjs/mult/divide.js
- build/esm/index.mjs
- build/esm/substract.mjs
- build/esm/mult/multiply.mjs
- build/esm/mult/divide.mjs
This setup is used for the build: package.json:
"main": "index.js",
"files": [
"build/cjs",
"build/esm",
"build/@types"
],
"types": "build/@types",
"exports": {
".": {
"import": "./build/esm/index.mjs",
"require": "./build/cjs/index.js"
},
"./*": {
"import": "./build/esm/*.mjs",
"require": "./build/cjs/*.js"
},
"./mult/*": {
"import": "./build/esm/mult/*.mjs",
"require": "./build/cjs/mult/*.js"
},
"./types":"./build/@types/index.d.ts",
"./types/*": "./build/@types/*.d.ts",
"./types/mult/*":"./build/@types/*.d.ts"
},
"scripts": {
"clean": "rimraf build",
"build": "yarn clean && yarn build:esm && yarn build:cjs && yarn build:types",
"build:esm": "tsc -p tsconfig.prod.json --module ES2022 --outDir build/esm",
"build:cjs": "tsc -p tsconfig.prod.json --module commonjs --outDir build/cjs",
"build:types": "tsc --p tsconfig.types.prod.json -emitDeclarationOnly",
"test": "echo \"Error: no test specified\" && exit 1",
"launch": "npx ts-node src/index"
},
tsconfig.json:
{
"$schema": "https://json.schemastore.org/tsconfig",
"display": "Default",
"compilerOptions": {
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"resolveJsonModule": true,
"isolatedModules": true,
"incremental": true,
"rootDir": ".",
"outDir": "build",
"sourceMap": false,
"target": "ESNext",
"noEmit": false,
"module": "CommonJS",
"moduleResolution": "node",
"declaration": true
},
"ts-node": {
"require": ["tsconfig-paths/register"]
},
"include": ["."],
"exclude": ["build", "node_modules", ".turbo", "coverage", "dist"],
"moduleResolution": ["node_modules", "node"]
}
And here's the tsconfig.types.prod.json:
{
"extends": "./tsconfig.json",
"compilerOptions": {
"composite": false,
"outDir" : "build/@types"
},
"exclude": [
"build",
"coverage",
"node_modules",
".turbo",
"coverage",
"dist",
"**/__test__",
"__test__",
"__mocks__",
"**/__mocks__",
"*.config.js",
"*.config.ts",
".env",
"src/**/*.test.ts"
]
}
You can view the importhere.
For reference, the initial issue with imports is displayedhere.
Note that both
addandmultiplyfunctions are functional; the primary aim is resolving the TS error.