Output Options
These options configure the build output generated by chayns-toolkit build.
All options aswell as the toolkit.config.js file itself are optional.
module.exports = {
output: {
/**
* Change the file-name your of primary output bundle. You can use any
* of the [webpack substitutions](https://webpack.js.org/configuration/output/#template-strings)
* as well as the `[package]` substitution, which will be replaced by
* the package name specified in your `package.json`. Defaults to
* `[package].[contenthash].js`.
*
* @type {string}
*/
filename: "[package].[contenthash].js",
/**
* Set an absolute path where your output will be emitted to.
*
* @type {string}
*/
path: "//my-qa-server/example-project",
entryPoints: {
// key defines the name of the resulting html-file (here index.html)
index: {
pathIndex: "./src/index", // path to your entry point index.js/index.ts
pathHtml: "./src/index.html", // path to the html template
},
},
/**
* Prefixes all css selectors with the name (in snake case) from the package.json.
* This requires that you wrap your application with a div which has that name as className.
* Known issue: Using this option does not work with css modules. (fixed with version 3.1.3)
*/
prefixCss: true,
/**
* The css version which should be used for the CHAYNS_TOOLKIT_CSS_TAG variable
*/
cssVersion: "4.2",
/**
* The option to use for transforming React JSX. The default value is "automatic", which means that the new JSX transform will be used. If you want to use the old JSX transform, you can set this option to "classic". Note that the old JSX transform is deprecated and will be removed in a future version of React.
* @type {'automatic' | 'classic'}
*/
reactRuntime: "automatic",
/**
* Enables and configures the React Compiler.
*
* Prefer configuring this option explicitly.
*
* For compatibility, the compiler is still automatically enabled when
* `babel-plugin-react-compiler` is installed and this option is omitted.
* This fallback is deprecated and will be removed in a future version.
*
* Use `false` to disable that auto-enable behavior, `true` to force it on,
* or provide an object to configure it explicitly.
*
* @type {boolean | { target?: string }}
*/
reactCompiler: {
target: "18",
},
/**
* Expose modules via Module Federation.
* See the Module Federation documentation for more details.
*
* @type {Record<string, string>}
*/
exposeModules: {
"./MyComponent": "./src/MyComponent",
},
/**
* Disable automatic React sharing in Module Federation.
*
* @type {boolean}
*/
disableReactSharing: false,
/**
* Overrides the `requiredVersion` used for Module Federation shared
* React packages.
*
* See the Module Federation documentation for details.
*
* @type {string | { react?: string, reactDom?: string }}
*/
reactRequiredVersions: {
react: "^19.0.0",
reactDom: "^19.0.0",
},
},
// ... other options ...
}
React Compiler​
Enable the React Compiler explicitly via output.reactCompiler.
If babel-plugin-react-compiler is installed and output.reactCompiler is omitted,
chayns-toolkit currently still enables the compiler automatically for compatibility. This fallback
is deprecated and will be removed in a future version.
You can override this behavior via output.reactCompiler:
falsedisables the compiler even if the package is installedtrueforces it on and uses the detected React version as target{ target: "18" }enables it and overrides the detected target explicitly
For React 17 and 18 projects, also install react-compiler-runtime.
Module Federation​
To expose modules that can be consumed by other applications at runtime, configure the
exposeModules option. This enables Module Federation.
For detailed information about Module Federation, including version compatibility requirements with
chayns-api and overriding React required versions, see the
Module Federation documentation.