Home » Javascript » How to build a Compiled Javascript library? [on hold]

How to build a Compiled Javascript library? [on hold]

Posted by: admin August 19, 2018 Leave a comment


Currently I’m maintaining a very big application. The main goal is to divide that application into smaller more manageable chunks that will be easier to build teams around.

The first step to divide the application is to create a shared private npm package that will contain both client and sever side code in ES6+ (needs to be compiled before actual use).

The main problem I am facing and thus the core of the question is:

  • how to deal with the compilation step?

I have a few important constraints about it:

  • I want to maintain the directory structure or module paths after compilation so it is easier to share the code across apps. i.e. import SomeComponent from '@myCompany/shared/path/to/SomeComponent'. Why? because I don't want the maintenance burden of keeping loads ofindex.js` files that export the “public” interface of the library, instead, all the files in the library are public by default. This provides maximum flexibility with minimal maintenance burden.

  • I need to work with css-modules. Most of the shared component will be already written with css-modules so I need to easily grab all `import styles from ‘./styles.scss’ and create an importable, library wide, already compiled, style sheet that consumer apps can use. That is why I cannot use plain babel directory compilation here. This looks like super easy to do with Webpack and some loaders.

  • I need to be flexible enough to work with old crappy abstractions, namely, the official app build system (does not work for libraries) compiles other shared libraries via some hardcoded configuration that is not changeable from the outside. This is bad because developing those old shared libraries is a pain because there isnt an easy way of changing them locally, then yarn link mySharedLib and test them locally along with your app, so that is why this solution does not work for me. But, I still would probably need to either ignore that old shared library in the build system or compile it like the official build system does. This also looks like manageable with Webpack via externals or by adding those old shared libraries to entries.

Any idea will help, even if it does not answer all of it.
Thanks a lot!