On this page ▾
Nx Monorepos
create-ngmd notices when it runs inside an Nx workspace (a folder with nx.json, or a folder below one). Instead of a standalone project, it writes an Nx app with a project.json, so you build and serve it with nx like any other app in the repo.
Add a docs app
Run the scaffolder from anywhere in the workspace:
pnpm create ngmd@latest docsnpm create ngmd@latest docsyarn create ngmd docsbun create ngmd docsThe app lands in apps/docs, and docs is its Nx project name. Then, from the workspace root:
pnpm install
pnpm nx serve docs
Open http://localhost:5173. pnpm nx build docs writes the static site to dist/apps/docs/analog/public and the Node server to dist/apps/docs/analog/server.
Options
| Option | What it does |
|---|---|
--directory <dir> |
Puts the app somewhere other than apps/<name>, relative to the workspace root. Example: --directory docs/site. |
--nx |
Fails instead of creating a standalone project when no nx.json is found. |
--no-nx |
Creates a standalone project even inside an Nx workspace. |
What changes compared to a standalone project
The app has the same src/, public/, build plugins and vite.config.ts as a standalone NgMd site. The differences are what an Nx app needs:
project.jsonhasbuild,serveandtesttargets that use the same executors as the Analog generator (@analogjs/platform:vite,@analogjs/platform:vite-dev-serverand@analogjs/vitest-angular:test), plus atypechecktarget that runstsc --noEmit.- Dependencies go to the workspace root
package.json. The scaffolder adds the ones the workspace doesn't have yet, including@nx/viteat yournxversion (the Analog executors need it). It never changes a version you already have, and it lists any version that differs from NgMd's, so you can check those. vite.config.tssetsrootto its own folder, builds intodist/<app folder>, shares the workspace Vite cache and resolves thepathsfrom your tsconfig, so imports from workspace libraries work.tsconfig.jsonextends the workspacetsconfig.base.json.site.githubDirinsrc/ngmd.config.tsis set to the app folder, so edit and source links point at the right files.- No
.gitignore, lockfile orangular.jsoninside the app, and nogit init. The workspace already owns those.
nx migrate handles Angular).
Code imports in a monorepo
Paths in ```ts file="..." blocks are relative to the app folder, the same as in a standalone site, even though Nx runs Vite from the workspace root.
Start from an empty Analog app
If you already ran nx g @analogjs/platform:application and haven't changed the app yet, it's simpler to replace it than to merge NgMd into it. Remove the app folder, then run the scaffolder with the same name and folder:
rm -rf apps/analog-app
pnpm create ngmd@latest analog-app --directory apps/analog-app
pnpm install
To add NgMd to an Analog app that already has your own code, follow the manual path on the Installation page.