# Builds

The dist directory of the npm package (opens new window) contains different builds:

Filename Module type JavaScript version Environment Package.json field About
chusho.js CommonJS ES51 Development main Used by old bundlers: Webpack 1, Browserify, …
chusho.min.js CommonJS ES51 Production -
chusho.umd.js UMD ES51 Development umd:main To be used in the browser with a <script /> tag
chusho.umd.min.js UMD ES51 Production -
esm/chusho.js ES Module ES20192 Development module Used by modern bundlers: Vue CLI, Webpack 2+, Rollup, …

1 ES5 is supported by all recent browsers and IE 11.

2 ES2019 is supported only by the most recent browsers.

# Browsers support

If you’re using Vue CLI, Webpack 2+, Rollup or another modern bundler, it’s probably going to import the ES Module described above. This is great as it will automatically enable tree-shaking (opens new window) and remove unused code from your app bundle.

However this version targets modern browsers (supporting ES2019 features), therefor if you need to support older browsers, you’ll have to transpile Chūshō’s code.

# Vue CLI

To transpile for older browsers using Vue CLI, you need to add it to the transpileDependencies array in vue.config.js (opens new window):




 


// vue.config.js

module.exports = {
  transpileDependencies: ['chusho']
}

# Webpack & Babel

To transpile for older browsers using a custom Webpack setup, you need to adapt your JavaScript loader configuration to include Chūshō. Usually it’s configured like this:










 






// webpack.config.js

module.exports = {
    // ...
    module: {
        rules: [
            {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/,
            },
        ],
    },
    // ...
};

Instead of excluding all node_modules, adapt the Regex to include Chūshō:





// ...
                exclude: /node_modules\/(?!chusho)/,
// ...
Last updated: 11/13/2020, 2:57:18 PM