Security News
Namecheap Takes Down Polyfill.io Service Following Supply Chain Attack
Polyfill.io has been serving malware for months via its CDN, after the project's open source maintainer sold the service to a company based in China.
esbuild-wasm
Advanced tools
Package description
The esbuild-wasm package is a WebAssembly-based version of the esbuild bundler and minifier. It provides extremely fast build times and is designed to be used in environments where native binaries cannot be executed, such as in browsers or some serverless platforms. It supports transforming, bundling, and minifying JavaScript and TypeScript files.
Bundling JavaScript
This code initializes esbuild-wasm and bundles a JavaScript file, outputting a single bundled file. It demonstrates how to set up and execute a basic bundling process.
const esbuild = require('esbuild-wasm');
esbuild.initialize({ worker: true, wasmURL: '/path/to/esbuild.wasm' }).then(() => {
esbuild.build({
entryPoints: ['input.js'],
bundle: true,
outfile: 'output.js'
}).catch(() => process.exit(1));
});
Minifying CSS
This example shows how to use esbuild-wasm to minify a CSS file. It sets up the esbuild environment and performs minification, outputting the minified CSS.
const esbuild = require('esbuild-wasm');
esbuild.initialize({ worker: true, wasmURL: '/path/to/esbuild.wasm' }).then(() => {
esbuild.build({
entryPoints: ['input.css'],
minify: true,
outfile: 'output.css'
}).catch(() => process.exit(1));
});
Transpiling TypeScript
This code snippet demonstrates how to transpile TypeScript into JavaScript using esbuild-wasm. It includes setting up the environment, specifying the loader for TypeScript files, and bundling the output.
const esbuild = require('esbuild-wasm');
esbuild.initialize({ worker: true, wasmURL: '/path/to/esbuild.wasm' }).then(() => {
esbuild.build({
entryPoints: ['input.ts'],
loader: { '.ts': 'ts' },
outfile: 'output.js',
bundle: true
}).catch(() => process.exit(1));
});
Webpack is a popular JavaScript module bundler with a vast ecosystem of plugins. It offers more configuration options and plugins compared to esbuild-wasm but is generally slower in terms of build speed.
Rollup is another module bundler that focuses on producing efficient bundles. It is known for its tree-shaking capabilities, which are similar to esbuild-wasm, but Rollup typically has slower build times and less efficient minification.
Parcel is a web application bundler that requires zero configuration for quick setup. It provides fast build times similar to esbuild-wasm and supports various file types natively, but it might not reach the same speed for larger projects.
Changelog
0.20.1
Fix a bug with the CSS nesting transform (#3648)
This release fixes a bug with the CSS nesting transform for older browsers where the generated CSS could be incorrect if a selector list contained a pseudo element followed by another selector. The bug was caused by incorrectly mutating the parent rule's selector list when filtering out pseudo elements for the child rules:
/* Original code */
.foo {
&:after,
& .bar {
color: red;
}
}
/* Old output (with --supported:nesting=false) */
.foo .bar,
.foo .bar {
color: red;
}
/* New output (with --supported:nesting=false) */
.foo:after,
.foo .bar {
color: red;
}
Constant folding for JavaScript inequality operators (#3645)
This release introduces constant folding for the < > <= >=
operators. The minifier will now replace these operators with true
or false
when both sides are compile-time numeric or string constants:
// Original code
console.log(1 < 2, '🍕' > '🧀')
// Old output (with --minify)
console.log(1<2,"🍕">"🧀");
// New output (with --minify)
console.log(!0,!1);
Better handling of __proto__
edge cases (#3651)
JavaScript object literal syntax contains a special case where a non-computed property with a key of __proto__
sets the prototype of the object. This does not apply to computed properties or to properties that use the shorthand property syntax introduced in ES6. Previously esbuild didn't correctly preserve the "sets the prototype" status of properties inside an object literal, meaning a property that sets the prototype could accidentally be transformed into one that doesn't and vice versa. This has now been fixed:
// Original code
function foo(__proto__) {
return { __proto__: __proto__ } // Note: sets the prototype
}
function bar(__proto__, proto) {
{
let __proto__ = proto
return { __proto__ } // Note: doesn't set the prototype
}
}
// Old output
function foo(__proto__) {
return { __proto__ }; // Note: no longer sets the prototype (WRONG)
}
function bar(__proto__, proto) {
{
let __proto__2 = proto;
return { __proto__: __proto__2 }; // Note: now sets the prototype (WRONG)
}
}
// New output
function foo(__proto__) {
return { __proto__: __proto__ }; // Note: sets the prototype (correct)
}
function bar(__proto__, proto) {
{
let __proto__2 = proto;
return { ["__proto__"]: __proto__2 }; // Note: doesn't set the prototype (correct)
}
}
Fix cross-platform non-determinism with CSS color space transformations (#3650)
The Go compiler takes advantage of "fused multiply and add" (FMA) instructions on certain processors which do the operation x*y + z
without intermediate rounding. This causes esbuild's CSS color space math to differ on different processors (currently ppc64le
and s390x
), which breaks esbuild's guarantee of deterministic output. To avoid this, esbuild's color space math now inserts a float64()
cast around every single math operation. This tells the Go compiler not to use the FMA optimization.
Fix a crash when resolving a path from a directory that doesn't exist (#3634)
This release fixes a regression where esbuild could crash when resolving an absolute path if the source directory for the path resolution operation doesn't exist. While this situation doesn't normally come up, it could come up when running esbuild concurrently with another operation that mutates the file system as esbuild is doing a build (such as using git
to switch branches). The underlying problem was a regression that was introduced in version 0.18.0.
Readme
This is the cross-platform WebAssembly binary for esbuild, a JavaScript bundler and minifier. See https://github.com/evanw/esbuild and the JavaScript API documentation for details.
FAQs
The cross-platform WebAssembly binary for esbuild, a JavaScript bundler.
The npm package esbuild-wasm receives a total of 1,778,256 weekly downloads. As such, esbuild-wasm popularity was classified as popular.
We found that esbuild-wasm demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Polyfill.io has been serving malware for months via its CDN, after the project's open source maintainer sold the service to a company based in China.
Security News
OpenSSF is warning open source maintainers to stay vigilant against reputation farming on GitHub, where users artificially inflate their status by manipulating interactions on closed issues and PRs.
Security News
A JavaScript library maintainer is under fire after merging a controversial PR to support legacy versions of Node.js.