What is unenv?
The 'unenv' npm package is designed to provide a universal environment for JavaScript and TypeScript projects. It allows developers to create isomorphic code that can run seamlessly in both Node.js and browser environments by providing polyfills and shims for various APIs.
What are unenv's main functionalities?
Polyfills for Node.js APIs
This feature provides polyfills for Node.js APIs, allowing you to use Node.js-specific features in a browser environment. The code sample demonstrates how to use the Buffer API from Node.js in a universal environment.
const { Buffer } = require('unenv/runtime/polyfills/buffer');
const buffer = Buffer.from('Hello, world!');
console.log(buffer.toString('utf-8'));
Environment Detection
This feature allows you to detect the current environment (Node.js or browser) and execute code conditionally based on that. The code sample shows how to check if the code is running in Node.js or a browser.
const { isNode, isBrowser } = require('unenv');
if (isNode) {
console.log('Running in Node.js');
} else if (isBrowser) {
console.log('Running in the browser');
}
Universal Fetch API
This feature provides a universal Fetch API that works in both Node.js and browser environments. The code sample demonstrates how to make a fetch request and handle the response.
const fetch = require('unenv/runtime/polyfills/fetch');
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data));
Other packages similar to unenv
isomorphic-fetch
The 'isomorphic-fetch' package provides a Fetch API implementation that works in both Node.js and browser environments. It is similar to the Fetch API polyfill provided by 'unenv', but it focuses solely on fetch functionality.
universal-env
The 'universal-env' package helps in detecting the current environment (Node.js or browser) and provides utility functions for environment-specific code. It is similar to the environment detection feature of 'unenv'.
node-polyfill-webpack-plugin
The 'node-polyfill-webpack-plugin' package provides polyfills for Node.js core modules in a Webpack environment. It is similar to the polyfills provided by 'unenv', but it is specifically designed for use with Webpack.
unenv
unenv
is a framework agnostic system that allows converting JavaScript code to be platform agnostic and working in any environment including Browsers, Workers, Node.js or pure JavaScript runtime.
Install
npm i -D unenv
yarn add --dev unenv
pnpm add -D unenv
Usage
Using env
utility and built-in presets (and nodeless), unenv
will provide an abstract configuration that can be used in building pipelines (rollup.js, webpack, etc.).
import { env, node, nodeless } from "unenv";
const { alias, inject, polyfill, external } = env(...presets);
Presets
node
Suitable to convert universal libraries working in Node.js. (preset)
- Add supports for global
fetch
API - Set Node.js built-ins as externals
nodeless
Using this preset, we can convert a code that is depending on Node.js to work anywhere else.
Built-in Node.js modules
unenv
provides a replacement for all Node.js built-ins for cross-platform compatiblity.
npm packages
unenv
provides a replacement for common npm packages for cross platform compatibility.
Auto-mocking proxy
import MockProxy from "unenv/runtime/mock/proxy";
console.log(MockProxy().foo.bar()[0]);
Above package doesn't work outside of Node.js and neither we need any platform specific logic! When aliasing os
to mock/proxy-cjs
, it will be auto mocked using a Proxy Object which can be recursively traversed like an Object
, called like a Function
, Iterated like an Array
, or instantiated like a Class
.
We use this proxy for auto mocking unimplemented internals. Imagine a package does this:
const os = require("os");
if (os.platform() === "windows") {
}
module.exports = () => "Hello world";
By aliasing os
to unenv/runtime/mock/proxy-cjs
, code will be compatible with other platforms.
Other polyfills
Please check ./src/runtime to discover other polyfills.
License
MIT