I've created a React component library which is getting quite big now, so I want to split it into submodules but am unable to do so.
The current setup is like this:
src/index.ts
export * from "./components";
export * from "./utils";
src/components/index.ts
export { default as CustomComponentOne } from "./CustomComponentOne";
export { default as CustomComponentTwo } from "./CustomComponentTwo";
src/utils/index.ts
export { default as utilOne } from "./utilOne";
export { default as utilTwo } from "./utilTwo";
package.json
{
...
"main": "dist/index.js",
"module": "dist/index.modern.js",
"source": "src/index.ts",
"scripts": {
"build": "microbundle-crl --no-compress --no-sourcemap --format modern,cjs",
...
},
...
}
My goal is to enable imports like:
import { CustomComponentOne } from "my-library/components"
import { utilOne } from "my-library/utils"
while preserving imports like
import { CustomComponentOne, utilOne } from "my-library"
The last import example is how everything is now imported, but I want to add imports like the two above. I was able to do this with compiling the project with tsc instead of microbundle-crl because this generated a .js file for each .ts file, but microbundle-crl creates 1 .js file as output. But SCSS files etc were not compiled with tsc (obviously).
Does anybody know how to go about this?