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.

/toolkit.config.js

module.exports = {
    output: {
        /**
         * Toggles single-file build functionality. Read more below
         *
         * @type {boolean}
         */
        singleBundle: false,

        /**
         * 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",
    },
    // ... other options ...
}

Single File Builds

In single-file build mode, the compiler will inline all assets (CSS, images, etc.) together with all JavaScript into a single bundle. This can be useful when building smaller fragments of a UI, e.g. some kind of plugin.