To ensure maintainability and compatibility with the Neo.mjs zero-builds dev mode, we must use a single version of highlight.js for both client-side and server-side rendering. The SSR process runs the exact same application code as the browser, so a single, universal module is required.
The stock npm package is CommonJS and not suitable for direct browser ESM import.
Plan
- Create a build script (e.g., in
buildScripts/) that uses the highlight.js build tools to generate a custom, universal bundle.
- The script must output a single file in ESM format (e.g.,
highlight.custom.mjs).
- This bundle must include only the languages required for the project:
bash, css, javascript, json, scss, xml.
- The generated file will be saved into the repository at
resources/lib/highlight/highlight.custom.mjs.
- This single, custom bundle will be the only version of
highlight.js used across the entire platform (Node.js and browser), ensuring consistency and maintainability.
Implementation Details
We have successfully created a build script that generates a custom highlight.js bundle.
The original plan was to use the highlight.js build tools directly, but we discovered that the npm package does not include them.
Instead, we have implemented a build script that:
- Clones the
highlight.js repository from GitHub into a temporary directory.
- Installs the dependencies.
- Runs the
highlight.js build script to generate a custom bundle with the required languages (bash, css, javascript, json, scss, xml).
- Copies the generated bundle and a minified version to the
dist/highlight directory.
- The script is cross-platform compatible and is run automatically after
npm install via a postinstall script. A manual build-highlightjs script is also available.
The generated files are placed in the dist/ folder and are not committed to the repository.
To ensure maintainability and compatibility with the Neo.mjs zero-builds dev mode, we must use a single version of
highlight.jsfor both client-side and server-side rendering. The SSR process runs the exact same application code as the browser, so a single, universal module is required.The stock npm package is CommonJS and not suitable for direct browser ESM import.
Plan
buildScripts/) that uses thehighlight.jsbuild tools to generate a custom, universal bundle.highlight.custom.mjs).bash,css,javascript,json,scss,xml.resources/lib/highlight/highlight.custom.mjs.highlight.jsused across the entire platform (Node.js and browser), ensuring consistency and maintainability.Implementation Details
We have successfully created a build script that generates a custom
highlight.jsbundle.The original plan was to use the
highlight.jsbuild tools directly, but we discovered that the npm package does not include them.Instead, we have implemented a build script that:
highlight.jsrepository from GitHub into a temporary directory.highlight.jsbuild script to generate a custom bundle with the required languages (bash,css,javascript,json,scss,xml).dist/highlightdirectory.npm installvia apostinstallscript. A manualbuild-highlightjsscript is also available.The generated files are placed in the
dist/folder and are not committed to the repository.