Ive just published my first package (a react component) to npm but im having some trouble understanding the difference between what the lib
directory is compared to the dist
.
Currently I generate both lib
and dist
however my package "main" points to the dist
unminified js file which has been built using webpack and output as UMD. The lib folder is built using babel
taking the src
and outputting to lib
.
The dist folder contains both [unminified/minified].js files as well as [unminified/minified].css files.
My main confusion is with the lib folder since imports from there currently wouldn't work seeing as I just transform src -> lib
meaning the scss references are still there and the scss files aren't transformed either.
I use CSS Modules (css-loader, styles-loader, postcss-loader etc) to generate my CSS files and this is where the confusion is since, wouldn't I also need to use webpack to generate my lib
folder seeing as the scss
files/import references need to be transformed to css
?
Are you meant to have both lib and dist or is the UMD build in dist fulling the same purpose as that of having a lib folder?
If you are supposed to have both how would I achieve this, since I couldnt find any info regarding generating the lib folder when using CSS modules within your js files and still maintaing the same folder structure of that of src (while still generating dist)?