tiny-invariant 🔬💥
A tiny invariant
alternative.
invariant
?
What is An invariant
function takes a value, and if the value is falsy then the invariant
function will throw. If the value is truthy, then the function will not throw.
import invariant from 'tiny-invariant';
invariant(truthyValue, 'This should not throw!');
invariant(falsyValue, 'This will throw!');
// Error('Invariant violation: This will throw!');
You can also provide a function to generate your message, for when your message is expensive to create
import invariant from 'tiny-invariant';
invariant(value, () => getExpensiveMessage());
tiny-invariant
?
Why The library: invariant
supports passing in arguments to the invariant
function in a sprintf style (condition, format, a, b, c, d, e, f)
. It has internal logic to execute the sprintf substitutions. The sprintf logic is not removed in production builds. tiny-invariant
has dropped all of the sprintf logic. tiny-invariant
allows you to pass a single string message. With template literals there is really no need for a custom message formatter to be built into the library. If you need a multi part message you can just do this:
invariant(condition, `Hello, ${name} - how are you today?`);
Type narrowing
tiny-invariant
is useful for correctly narrowing types for flow
and typescript
const value: Person | null = { name: 'Alex' }; // type of value == 'Person | null'
invariant(value, 'Expected value to be a person');
// type of value has been narrowed to 'Person'
(condition: any, message?: string | (() => string)) => void
API: condition
is required and can be anythingmessage
optionalstring
or a function that returns astring
(() => string
)
Installation
# yarn
yarn add tiny-invariant
# npm
npm install tiny-invariant --save
message
for kb savings!
Dropping your Big idea: you will want your compiler to convert this code:
invariant(condition, 'My cool message that takes up a lot of kbs');
Into this:
if (!condition) {
if ('production' !== process.env.NODE_ENV) {
invariant(false, 'My cool message that takes up a lot of kbs');
} else {
invariant(false);
}
}
- Babel: recommend
babel-plugin-dev-expression
- TypeScript: recommend
tsdx
(or you can runbabel-plugin-dev-expression
after TypeScript compiling)
Your bundler can then drop the code in the "production" !== process.env.NODE_ENV
block for your production builds to end up with this:
if (!condition) {
invariant(false);
}
- rollup: use rollup-plugin-replace and set
NODE_ENV
toproduction
and thenrollup
will treeshake out the unused code - Webpack: instructions
Builds
- We have a
es
(EcmaScript module) build - We have a
cjs
(CommonJS) build - We have a
umd
(Universal module definition) build in case you needed it
We expect process.env.NODE_ENV
to be available at module compilation. We cache this value
That's it!
🤘