Installation
Install Mutative from npm or load it from a CDN, and check the environments it supports.
Package managers
npm install mutativeMutative has no dependencies. A production bundle of create alone is about 7.9 kB after Brotli compression, and one of create, apply, current and original about 8.5 kB, including patches, Map and Set support and native array methods, which need no plugins.
import { create } from 'mutative';Requirements
- JavaScript. Mutative needs
Proxyand the ES2018 syntax that its builds keep, such as object spread: Node.js 14.0 or later, current browsers, and React Native 0.64 or later. Engines that supportProxybut not ES2018 syntax, such as Chrome 49–59, Firefox 18–54, Safari 10–11.0 and Edge 12–18, need Mutative transpiled by your build. Internet Explorer has noProxyand is not supported. - TypeScript. The type declarations support TypeScript 5.0 and later; see TypeScript.
Development and production builds
The package holds a development build, with full error messages, warnings and extra checks, and a minified production build, whose errors are numeric codes. Which one runs depends on process.env.NODE_ENV:
- Bundlers resolve the ESM build, whose development checks compare
process.env.NODE_ENVwith'production'. Bundlers that define it as'production', as webpack, Vite, Rollup and esbuild setups for production usually do, drop the development code. Bundles that target Node.js resolve the CommonJS entry instead; defineprocess.env.NODE_ENVthere, or leave Mutative external. - Node.js runs the CommonJS build for
requireandimportalike, and selects the development or production build fromNODE_ENVwhen it loads Mutative. - Browsers without a bundler have no
process, so they need the production ESM file or the UMD build below.
CDN
- Unpkg:
<script src="https://unpkg.com/mutative"></script> - JSDelivr:
<script src="https://cdn.jsdelivr.net/npm/mutative"></script> - ES module:
import { create } from 'https://unpkg.com/mutative/dist/mutative.esm.production.min.mjs';
The <script> tags load the production UMD build, which defines a global Mutative, as in Mutative.create(baseState, recipe). The package's other ESM files read process.env.NODE_ENV, which bundlers and Node.js provide; a browser without a bundler needs the production file above.
<script type="module">
import { create } from 'https://unpkg.com/mutative/dist/mutative.esm.production.min.mjs';
const state = create({ count: 0 }, (draft) => {
draft.count += 1;
});
console.log(state.count); // 1
</script>Last updated on by unadlib