Skip to content

Builders, plugin and CLI

The entry points of the new engine: its Vite plugin, its Vite builders, the ng-doc command line interface, the schematics and the environment switches. Dev server and builds explains how they run.

Entry points

Entry pointPackageName
Vite plugin@ng-doc/buildercreateNgDocVitePlugin, createNgDocAngularPlugins, createNgDocApplicationPlugin
Vite builders@ng-doc/builder@ng-doc/builder:vite-application, @ng-doc/builder:vite-dev-server
Prerendering@ng-doc/builder@ng-doc/builder:vite-application, ng-doc prerender
Command line interface@ng-doc/builderng-doc
Legacy builders@ng-doc/builder@ng-doc/builder:application, @ng-doc/builder:dev-server, deprecated (Legacy builders)

Vite plugin

Import the plugin from the built entry points of @ng-doc/builder:

vite.config.tsTypeScript
import { createNgDocAngularPlugins } from '@ng-doc/builder/generator/vite/angular/index.js';
import { createNgDocVitePlugin } from '@ng-doc/builder/generator/vite/index.js';

createNgDocVitePlugin(options)

Returns the Vite plugins that run the new engine inside the Vite development server and build.

OptionTypeDefaultDescription
generatorGeneratorBootstrapOptionsrequiredThe engine options. See Builders, plugin and CLI [Generator options].
angularPluginsPlugin[]requiredThe array returned by createNgDocAngularPlugins.
analogLiveReloadtruerequiredConfirms that the Angular plugins use liveReload: true.
angularComponentProbestringrequiredThe absolute path of a component that is always in the application, such as the root component.
generatedAliasstring'@ng-doc/generated'The import path of the generated code.
maxExternalWatchTargetsnumber50000The most files and folders the plugin watches outside the Vite root.
themeModulesRecord<string, string>{}Browser module paths for Shiki themes other than css-variables, github-light and ayu-dark.
progressstring'auto'The progress output: auto, live, plain, verbose, summary or off (Progress output).

Generator options

OptionTypeDefaultDescription
projectIdstringrequiredThe project name. It names the generated and cache folders.
workspaceRootstringrequiredThe absolute path of the workspace root.
configFilestring–The absolute path of the configuration file. It is discovered by default.
discovery.tagsstring[]The Vite modeThe build tags matched against onlyForTags. The Vite mode is development for the server and production for a build.
defaults.docsRootstringrequiredThe documentation folder, used when the configuration has no docsPath.
defaults.tsConfigstringrequiredThe TypeScript configuration, used when the configuration has no tsConfig.
defaults.outputRootstringrequiredThe generated folder, used when the configuration has no outDir.
defaults.cacheRootstringrequiredThe cache folder.

All paths are absolute.

createNgDocApplicationPlugin(options)

Returns the Vite plugin that builds and serves the Angular application the way the Angular CLI application builder does. Relative paths are relative to workspaceRoot.

OptionTypeDefaultDescription
workspaceRootstringThe current folderThe absolute path of the workspace root.
sourceRootstringThe folder of browserThe project's source folder. A path in assets is copied to its path relative to it.
browserstringrequiredThe browser entry, such as src/main.ts.
serverstring–The server entry, such as src/main.server.ts. Needed to prerender.
polyfillsstring[][]Modules loaded first, such as zone.js. The server keeps only zone.js (as zone.js/node) and @angular/localize/init.
stylesstring[][]Global style sheets.
assets(string|object)[][]Files copied into the build and served in development, as in the assets of angular.json.

Other options of an angular.json build target fail with NGDOC_VITE_APPLICATION_OPTION, which names their Vite or Analog equivalent. allowedCommonJsDependencies, budgets, extractLicenses, namedChunks, optimization, outputHashing, progress, sourceMap, statsJson and verbose only log a warning. vite build sets ngDevMode and ngJitMode to false in every mode, unless the Vite define sets them.

createNgDocAngularPlugins(options)

Returns the Analog Angular plugins in the configuration that NgDoc supports. It accepts the options of @analogjs/vite-plugin-angular, except that liveReload must stay true, and jit, disableTypeChecking and fastCompile must stay false.

Limitations

  • vite build --watch is not supported. Use the development server.
  • The development server needs file watching and hot module replacement. Don't disable server.watch or server.hmr.

Vite builders

@ng-doc/builder:vite-application and @ng-doc/builder:vite-dev-server run a Vite configuration for ng build and ng serve. Paths are relative to the workspace root.

BuilderOptionTypeDefaultDescription
bothconfigFilestringrequiredThe Vite configuration file.
bothmodestringproduction / developmentThe Vite mode.
vite-applicationoutputPathstringrequiredThe output folder: browser/, server/server.mjs, prerendered-routes.json.
vite-applicationssrbooleantrue with a server entryBuilds the server bundle.
vite-applicationprerenderbooleantrue when the server bundle is builtPrerenders every route into browser/.
vite-applicationroutesstring[][]Routes prerendered in addition to the discovered ones.
vite-applicationdiscoverRoutesbooleantruePrerenders every route of the router configuration.
vite-applicationrouteTimeoutnumberNo limitFails a route that takes longer to render, in milliseconds.
vite-dev-serverhost, port–Vite's server optionsWhere the development server listens.

The NgDoc options, such as progress and generator.discovery.tags, come from the Vite plugin in the configuration file. Without generator.discovery.tags, the build tags are the mode (Pages and categories [Build tags]).

Command line interface

The ng-doc command generates the documentation without Angular CLI or Vite. Use it in scripts and in custom hosts.

ng-doc generate --project <project-name>
ng-doc dev --project <project-name> -- <command> [arguments]
ng-doc prerender --vite-config <file> --output-path <folder>
CommandEffect
generateGenerates the documentation once for production and exits.
devGenerates the documentation, then watches for changes. After --, it also starts a command, such as a dev server, and stops it on exit.
watchThe same as dev.
prerenderBuilds a Vite host application for production and prerenders every route, as the vite-application builder does. Its flags are --vite-config, --output-path, --mode, --routes <a,b>, --route-timeout <ms>, --no-discover and --skip-build (prerender an existing output again).
FlagDefaultDescription
--project <id>requiredThe project name.
--workspace <path>The current folderThe workspace root.
--config <path>DiscoveredThe configuration file.
--docs-root <path>docsThe documentation folder, if the configuration has no docsPath.
--tsconfig <path>tsconfig.jsonThe TypeScript configuration, if the configuration has no tsConfig.
--output-root <path>.ng-doc/<project-name>The generated folder, if the configuration has no outDir.
--cache-root <path>.cache/ng-doc/<project-name>The cache folder.
--jsonoffPrints results and diagnostics as JSON lines.
--progress <mode>autoThe progress output: auto, live, plain, verbose, summary, json or off (Progress output).
--tags <a,b>production for generate, development for dev and watchThe build tags matched against onlyForTags.

Paths are relative to the workspace root. --help prints the usage, and --version prints the version.

Exit codeMeaning
0Success.
1The generation failed.
2Invalid command or flags.
130Stopped with SIGINT.
143Stopped with SIGTERM.

With a command after --, ng-doc dev exits with that command's exit code.

Schematics

CommandCreates
ng add @ng-doc/addThe NgDoc setup: the Vite host, or the legacy builders with --engine legacy (Installation).
ng g @ng-doc/builder:page "<title>"A page folder with ng-doc.page.ts and index.md.
ng g @ng-doc/builder:category "<title>"A category folder with ng-doc.category.ts.
ng g @ng-doc/builder:apiAn ng-doc.api.ts file.
ng g @ng-doc/builder:migrate-to-viteThe Vite host setup of a legacy project (Migrate to the new engine).

The page, category and API schematics create files in the current folder. Pass --path to use another folder.

OptionSchematicsDescription
--name, -npage, categoryThe name of the exported variable.
--route, -rpage, categoryThe route field.
--category, -cpage, categoryImports the closest ng-doc.category.ts as the parent.
--order, -opage, categoryThe order field.
--expandable, -ecategoryThe expandable field.
--expanded, -xcategoryThe expanded field.

migrate-to-vite moves a project from the legacy builders to the Vite engine. It writes a report to .ng-doc-migration/<project-name>/report.md, and --dry-run shows the changes without writing them.

OptionDefaultDescription
--projectThe only project on the legacy buildersThe project to migrate.
--revertfalseUndoes the migration of the project: restores its targets and files.
--vite-configvite.config.mjs in the project folderThe Vite configuration file to create, relative to the workspace root.
--root-componentFound from the browser entryThe root component's file, relative to the workspace root.
--skip-installfalseDoesn't install the added dependencies.

Environment switches

The new engine reads these variables in every entry point. Each one turns off one optimization. Use them to find the cause of a problem, and report it (Troubleshooting).

VariableDefaultWhen set to 0, false, off or no
NGDOC_PERSISTENT_WORKERonStarts a new compiler worker for every development build. It keeps no TypeScript program between builds, so this also turns off the next two switches, the targeted rebuild and the reuse of the program.
NGDOC_PERSISTENT_WORKER_PRIMEonDoesn't prepare the compiler worker for the first edit: the server's first build runs in a separate worker, and the first edit after the start rebuilds the TypeScript program.
NGDOC_DELTA_TRANSPORTonSends complete snapshots to the compiler worker instead of changes.
NGDOC_INCREMENTAL_SKIPonRecompiles the TypeScript program from scratch on every development build.
NGDOC_TARGETED_REBUILDonChecks every page on every development build, instead of only the pages that an edit can reach.
NGDOC_INCREMENTAL_PROGRAMonBuilds a new TypeScript program after a TypeScript edit, instead of updating the kept one.
NGDOC_SEMANTIC_RECORDERonStops recording which files each TypeScript query reads. After a TypeScript edit, every page that reads TypeScript is rendered again, as with the next switch off.
NGDOC_SCOPED_SEMANTIConAfter any TypeScript edit, renders again every page that reads TypeScript, such as API pages, API embeds, demos and playgrounds, instead of only those that read the edited code. Also turns off the next switch.
NGDOC_SHAPE_CLOSUREonRenders again every page whose TypeScript imports an edited file, even when the edit changes no declared type.
NGDOC_TRACKED_PROGRAM_REUSEonTracks the whole TypeScript program again for every API embed of a production build (or with NGDOC_SCOPED_SEMANTIC off), instead of once per build. The output is the same.
NGDOC_ANGULAR_SHARED_PASSonVite host only. Compiles each generated TypeScript module that an edit changed in an Angular pass of its own, instead of one pass for all of them.
NGDOC_ANGULAR_STRUCTURAL_PASSonVite host only. When an edit adds, moves or deletes pages, compiles the application once more on those files before the pass that compiles the edit.
NGDOC_FAST_STARTonGenerates every page on a development server start, even when no file changed since the last run, and doesn't reuse the cached links and generated files of unchanged pages on a start after edits.
NGDOC_VITE_BUILD_HANDOFFonvite-application only. Generates the documentation again for the server bundle instead of reusing the browser build's generation.
NGDOC_PARALLEL_WRITESonWrites the generated files one at a time, instead of several at once. The published files are the same.
NGDOC_HIGHLIGHT_CACHEonHighlights every code block again, instead of reusing the highlighting of code that it highlighted before. The published files are the same.
NGDOC_PARALLEL_RENDERonProcesses the HTML of every page in one thread, instead of on up to four worker threads in a build that renders many pages. The published files are the same.

Production builds always use a fresh compiler worker, whatever these variables say.

Supported versions

DependencyVersion
Angular (@ng-doc/app, @ng-doc/ui-kit)>=22.0.0 <23.0.0
@angular/compiler, @angular/compiler-cli (@ng-doc/builder)>=22.0.0 <23.0.0
Node.js>=24.15.0 <25
Vite (Vite host only)^8.3.0
@analogjs/vite-plugin-angular (Vite host only)^2.8.0
@angular/compiler, @angular/compiler-cli (Vite host only)^22.0.0
PlatformsLinux, macOS and Windows

The Vite engine is tested with Vite 8.3.2, Analog 2.8.0 and Angular 22.1 and 22.2. It checks the Vite version when it starts and stops with NGDOC_VITE_VERSION outside ^8.3.0. ng add and migrate-to-vite add these ranges to devDependencies when package.json doesn't list them, so npm installs the newest matching releases.

@ng-doc/builder takes @angular/build >=22.0.0 <23.0.0 as a peer dependency, the project's own copy, and depends on @angular-devkit/core >=22.0.0 <23.0.0 and @angular-devkit/architect >=0.2200.0 <0.2300.0, which the package manager shares with the project where it can: both engines run on the project's Angular 22 release. The Vite engine stops with NGDOC_VITE_ANGULAR_VERSION when the @angular/build it finds and @angular/compiler-cli come from different sides of Angular 22.2. The optional peer dependencies admit any Angular 22 for the Angular compilers, Analog ^2.8.0, and for vite Analog's own range (^6.0.0 || ^7.0.0 || ^8.0.0), so that installing NgDoc never fails on the Vite that Angular 22.0 or 22.1 brings before the migration adds Vite 8.3. NgDoc bundles its own patched copy of Analog's Angular plugin; the installed one supplies its types. The legacy builders don't use Vite or Analog.

Edit this page