1

I was wondering how to generate a CSS, SASS, and vanilla JS library in an Nx Integrated monorepo?

Well, my apps are in Angular, and my 'feature' tagged libs are also Angular components. So far, so good... But I also have 'ui' and 'util' tagged libs that are in pure CSS, SASS, and JS. They are NOT Angular components specifically... So is there a way to generate such libs by command? And also leverage the 'Module Boundaries' concept?

Ali
  • 1,268
  • 1
  • 13
  • 20
  • fyi asking for "the best" is normally a sign of a bad question. For angular you'd use the styles, assets, and scripts part of the `project.json` (or angular.json for vanilla angular projects). I'll post details – Andrew Allen Aug 30 '23 at 10:32
  • 1
    are you asking about this - https://nx.dev/packages/esbuild/documents/overview? – 31piy Aug 30 '23 at 11:15

1 Answers1

0

You don't need a library for this.

Example adding style files, repeat per app. Input glob (see Assets Configuration) is required since the file is outside the project root. Similar for assets or scripts.

project.json

{
        // ...
        "styles": [
          "apps/admin/src/styles.scss",
          {
            // path from root to file
            "input": "libs/storybook-host/src/lib/material-theme.scss"
          }
        ],
        // ...
}
Andrew Allen
  • 6,512
  • 5
  • 30
  • 73
  • Yea, of course we can import any JS or CSS to our app like that... Maybe I asked my question not clearly... I actually wanted to see, can we have a buildable lib? Because we may have a vanilla JS mini-app with some SASS files, and need it to be bundled by Webpack, and then use the bundled final JS and CSS files in our app! (e.g., by importing the final files in the `project.json`). That's what I like to see, if it's possible! As far as I have seen in the Nx Docs, we can only have Angular buildable libs. – Ali Aug 30 '23 at 11:05
  • 1
    Yep, no way to infer that meaning from the question. You can have a js lib that builds (webpack/ esbuild) and point the project.json inputs to the dist folder with the outputs. You can in Nx have apps implicitly depend on this lib to guarantee the build occurs first. Is that something that meets the requirements? – Andrew Allen Aug 30 '23 at 11:35