Rspack plugins

Nx uses enhanced Rspack configuration files (e.g. rspack.config.js). These configuration files export a plugin that takes in a rspack configuration object and returns an updated configuration object. Plugins are used by Nx to add functionality to the Rspack build.

This guide contains information on the plugins provided by Nx. For more information on customizing Rspack configuration, refer to the Nx Rspack configuration guide.


The withNx plugin provides common configuration for the build, including TypeScript support and linking workspace libraries (via tsconfig paths).


const { composePlugins, withNx } = require('@nrwl/rspack'); module.exports = composePlugins(withNx(), (config) => { // Further customize Rspack config return config; });


The withWeb plugin adds support for CSS/SASS/Less/Stylus stylesheets, assets (such as images and fonts), and index.html processing.



Type: { includePaths: string[] }

Options to pass to style preprocessors. includePaths is a list of paths that are included (e.g. workspace libs with stylesheets).


const { composePlugins, withNx, withWeb } = require('@nrwl/rspack'); module.exports = composePlugins( // always pass withNx() first withNx(), // add web functionality withWeb({ stylePreprocessorOptions: ['ui/src'], }), (config) => { // Further customize Rspack config return config; } );


The withReact plugin adds support for React JSX and Fast Refresh


const { composePlugins, withNx, withReact } = require('@nrwl/rspack'); module.exports = composePlugins( withNx(), // always pass withNx() first withReact({ stylePreprocessorOptions: ['ui/src'], }), (config) => { // Further customize Rspack config return config; } );