esbuild 0.19.3
-
Fix
list-style-typewith thelocal-cssloader (#3325)The
local-cssloader incorrectly treated all identifiers provided tolist-style-typeas a custom local identifier. That included identifiers such asnonewhich have special meaning in CSS, and which should not be treated as custom local identifiers. This release fixes this bug:/* Original code */ ul { list-style-type: none } /* Old output (with --loader=local-css) */ ul { list-style-type: stdin_none; } /* New output (with --loader=local-css) */ ul { list-style-type: none; }Note that this bug only affected code using the
local-cssloader. It did not affect code using thecssloader. -
Avoid inserting temporary variables before
use strict(#3322)This release fixes a bug where esbuild could incorrectly insert automatically-generated temporary variables before
use strictdirectives:// Original code function foo() { 'use strict' a.b?.c() } // Old output (with --target=es6) function foo() { var _a; "use strict"; (_a = a.b) == null ? void 0 : _a.c(); } // New output (with --target=es6) function foo() { "use strict"; var _a; (_a = a.b) == null ? void 0 : _a.c(); } -
Adjust TypeScript
enumoutput to better approximatetsc(#3329)TypeScript enum values can be either number literals or string literals. Numbers create a bidirectional mapping between the name and the value but strings only create a unidirectional mapping from the name to the value. When the enum value is neither a number literal nor a string literal, TypeScript and esbuild both default to treating it as a number:
// Original TypeScript code declare const foo: any enum Foo { NUMBER = 1, STRING = 'a', OTHER = foo, } // Compiled JavaScript code (from "tsc") var Foo; (function (Foo) { Foo[Foo["NUMBER"] = 1] = "NUMBER"; Foo["STRING"] = "a"; Foo[Foo["OTHER"] = foo] = "OTHER"; })(Foo || (Foo = {}));However, TypeScript does constant folding slightly differently than esbuild. For example, it may consider template literals to be string literals in some cases:
// Original TypeScript code declare const foo = 'foo' enum Foo { PRESENT = `${foo}`, MISSING = `${bar}`, } // Compiled JavaScript code (from "tsc") var Foo; (function (Foo) { Foo["PRESENT"] = "foo"; Foo[Foo["MISSING"] = `${bar}`] = "MISSING"; })(Foo || (Foo = {}));The template literal initializer for
PRESENTis treated as a string while the template literal initializer forMISSINGis treated as a number. Previously esbuild treated both of these cases as a number but starting with this release, esbuild will now treat both of these cases as a string. This doesn't exactly match the behavior oftscbut in the case where the behavior divergestscreports a compile error, so this seems like acceptible behavior for esbuild. Note that handling these cases completely correctly would require esbuild to parse type declarations (see thedeclarekeyword), which esbuild deliberately doesn't do. -
Ignore case in CSS in more places (#3316)
This release makes esbuild's CSS support more case-agnostic, which better matches how browsers work. For example:
/* Original code */ @KeyFrames Foo { From { OpaCity: 0 } To { OpaCity: 1 } } body { CoLoR: YeLLoW } /* Old output (with --minify) */ @KeyFrames Foo{From {OpaCity: 0} To {OpaCity: 1}}body{CoLoR:YeLLoW} /* New output (with --minify) */ @KeyFrames Foo{0%{OpaCity:0}To{OpaCity:1}}body{CoLoR:#ff0}Please never actually write code like this.
-
Improve the error message for
nullentries inexports(#3377)Package authors can disable package export paths with the
exportsmap inpackage.json. With this release, esbuild now has a clearer error message that points to thenulltoken inpackage.jsonitself instead of to the surrounding context. Here is an example of the new error message:✘ [ERROR] Could not resolve "msw/browser" lib/msw-config.ts:2:28: 2 │ import { setupWorker } from 'msw/browser'; ╵ ~~~~~~~~~~~~~ The path "./browser" cannot be imported from package "msw" because it was explicitly disabled by the package author here: node_modules/msw/package.json:17:14: 17 │ "node": null, ╵ ~~~~ You can mark the path "msw/browser" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle. -
Parse and print the
withkeyword inimportstatementsJavaScript was going to have a feature called "import assertions" that adds an
assertkeyword toimportstatements. It looked like this:import stuff from './stuff.json' assert { type: 'json' }The feature provided a way to assert that the imported file is of a certain type (but was not allowed to affect how the import is interpreted, even though that's how everyone expected it to behave). The feature was fully specified and then actually implemented and shipped in Chrome before the people behind the feature realized that they should allow it to affect how the import is interpreted after all. So import assertions are no longer going to be added to the language.
Instead, the current proposal is to add a feature called "import attributes" instead that adds a
withkeyword to import statements. It looks like this:import stuff from './stuff.json' with { type: 'json' }This feature provides a way to affect how the import is interpreted. With this release, esbuild now has preliminary support for parsing and printing this new
withkeyword. Thewithkeyword is not yet interpreted by esbuild, however, so bundling code with it will generate a build error. All this release does is allow you to use esbuild to process code containing it (such as removing types from TypeScript code). Note that this syntax is not yet a part of JavaScript and may be removed or altered in the future if the specification changes (which it already has once, as described above). If that happens, esbuild reserves the right to remove or alter its support for this syntax too.