Monorepo
A guide to setting up Master CSS in a modern repository.
Foreword
The Language Server and ESLint both support the monorepo.
By default, language server will form independent workspaces based on the location of the master.css.* configuration files, independent of the package manager's workspace. The same goes for ESLint, which forms a new working directory based on the location of its configuration file.
Officially integrated packages or extensions will automatically read the master.css.* configuration based on the current running directory. This means that you can start using it with zero configuration as long as you create a configuration file in the workspace.
One root master.css.js
Whether it's a single repository or a monorepo, create a master.css.js file in the root directory for your design system.
The language service will create at least a root workspace regardless of whether master.css.* exists.
One master.css.js per microservice
When there are different design systems or complex requirements in a monorepo, you may need to create master.css.js and eslint.config.js for multiple folders to serve as workspaces.
This will create two workspaces, / and /apps/a.
Note that /apps/b will be considered part of the root workspace /.
Shared the configuration
In each workspace, you need to export the common root configuration.
export { default } from '../../master.css'Or extend it and add workspace-specific customization options.
import common from '../../master.css'export default { extends: [ common ], ...}Regardless of whether there is a specific workspace configuration, exporting the configuration is necessary when the workspace exists in eslint.config.js.
Forgot to create /apps/a/master.css.js in the workspace and export the root configuration.
Unless this workspace is not using Master CSS, this is a common oversight.
Finally, using a monorepo and having multiple workspaces doesn't mean you have to create multiple configurations, in most cases, you just need one root master.css.js.