Releases: evanw/esbuild
v0.11.8
-
Fix hash calculation for code splitting and dynamic imports (#1076)
The hash included in the file name of each output file is intended to change if and only if anything relevant to the content of that output file changes. It includes:
- The contents of the file with the paths of other output files omitted
- The output path of the file the final hash omitted
- Some information about the input files involved in that output file
- The contents of the associated source map, if there is one
- All of the information above for all transitive dependencies found by following
import
statements
However, this didn't include dynamic
import()
expressions due to an oversight. With this release, dynamicimport()
expressions are now also counted as transitive dependencies. This fixes an issue where the content of an output file could change without its hash also changing. As a side effect of this change, dynamic imports inside output files of other output files are now listed in the metadata file if themetafile
setting is enabled. -
Refactor the internal module graph representation
This release changes a large amount of code relating to esbuild's internal module graph. The changes are mostly organizational and help consolidate most of the logic around maintaining various module graph invariants into a separate file where it's easier to audit. The Go language doesn't have great abstraction capabilities (e.g. no zero-cost iterators) so the enforcement of this new abstraction is unfortunately done by convention instead of by the compiler, and there is currently still some code that bypasses the abstraction. But it's better than it was before.
Another relevant change was moving a number of special cases that happened during the tree shaking traversal into the graph itself instead. Previously there were quite a few implicit dependency rules that were checked in specific places, which was hard to follow. Encoding these special case constraints into the graph itself makes the problem easier to reason about and should hopefully make the code more regular and robust.
Finally, this set of changes brings back full support for the
sideEffects
annotation inpackage.json
. It was previously disabled when code splitting was active as a temporary measure due to the discovery of some bugs in that scenario. But I believe these bugs have been resolved now that tree shaking and code splitting are done in separate passes (see the previous release for more information).
v0.11.7
-
Fix incorrect chunk reference with code splitting, css, and dynamic imports (#1125)
This release fixes a bug where when you use code splitting, CSS imports in JS, and dynamic imports all combined, the dynamic import incorrectly references the sibling CSS chunk for the dynamic import instead of the primary JS chunk. In this scenario the entry point file corresponds to two different output chunks (one for CSS and one for JS) and the wrong chunk was being picked. This bug has been fixed.
-
Split apart tree shaking and code splitting (#1123)
The original code splitting algorithm allowed for files to be split apart and for different parts of the same file to end up in different chunks based on which entry points needed which parts. This was done at the same time as tree shaking by essentially performing tree shaking multiple times, once per entry point, and tracking which entry points each file part is live in. Each file part that is live in at least one entry point was then assigned to a code splitting chunk with all of the other code that is live in the same set of entry points. This ensures that entry points only import code that they will use (i.e. no code will be downloaded by an entry point that is guaranteed to not be used).
This file-splitting feature has been removed because it doesn't work well with the recently-added top-level await JavaScript syntax, which has complex evaluation order rules that operate at file boundaries. File parts now have a single boolean flag for whether they are live or not instead of a set of flags that track which entry points that part is reachable from (reachability is still tracked at the file level).
However, this change appears to have introduced some subtly incorrect behavior with code splitting because there is now an implicit dependency in the import graph between adjacent parts within the same file even if the two parts are unrelated and don't reference each other. This is due to the fact each entry point that references one part pulls in the file (but not the whole file, only the parts that are live in at least one entry point). So liveness must be fully computed first before code splitting is computed.
This release splits apart tree shaking and code splitting into two separate passes, which fixes certain cases where two generated code splitting chunks ended up each importing symbols from the other and causing a cycle. There should hopefully no longer be cycles in generated code splitting chunks.
-
Make
this
work in static class fields in TypeScript filesCurrently
this
is mis-compiled in static fields in TypeScript files if theuseDefineForClassFields
setting intsconfig.json
isfalse
(the default value):class Foo { static foo = 123 static bar = this.foo } console.log(Foo.bar)
This is currently compiled into the code below, which is incorrect because it changes the value of
this
(it's supposed to refer toFoo
):class Foo { } Foo.foo = 123; Foo.bar = this.foo; console.log(Foo.bar);
This was an intentionally unhandled case because the TypeScript compiler doesn't handle this either (esbuild's currently incorrect output matches the output from the TypeScript compiler, which is also currently incorrect). However, the TypeScript compiler might fix their output at some point in which case esbuild's behavior would become problematic.
So this release now generates the correct output:
const _Foo = class { }; let Foo = _Foo; Foo.foo = 123; Foo.bar = _Foo.foo; console.log(Foo.bar);
Presumably the TypeScript compiler will be fixed to also generate something like this in the future. If you're wondering why esbuild generates the extra
_Foo
variable, it's defensive code to handle the possibility of the class being reassigned, since class declarations are not constants:class Foo { static foo = 123 static bar = () => Foo.foo } let bar = Foo.bar Foo = { foo: 321 } console.log(bar())
We can't just move the initializer containing
Foo.foo
outside of the class body because in JavaScript, the class name is shadowed inside the class body by a special hidden constant that is equal to the class object. Even if the class is reassigned later, references to that shadowing symbol within the class body should still refer to the original class object. -
Various fixes for private class members (#1131)
This release fixes multiple issues with esbuild's handling of the
#private
syntax. Previously there could be scenarios where references tothis.#private
could be moved outside of the class body, which would cause them to become invalid (since the#private
name is only available within the class body). One such case is when TypeScript'suseDefineForClassFields
setting has the valuefalse
(which is the default value), which causes class field initializers to be replaced with assignment expressions to avoid using "define" semantics:class Foo { static #foo = 123 static bar = Foo.#foo }
Previously this was turned into the following code, which is incorrect because
Foo.#foo
was moved outside of the class body:class Foo { static #foo = 123; } Foo.bar = Foo.#foo;
This is now handled by converting the private field syntax into normal JavaScript that emulates it with a
WeakMap
instead.This conversion is fairly conservative to make sure certain edge cases are covered, so this release may unfortunately convert more private fields than previous releases, even when the target is
esnext
. It should be possible to improve this transformation in future releases so that this happens less often while still preserving correctness.
v0.11.6
-
Fix an incorrect minification transformation (#1121)
This release removes an incorrect substitution rule in esbuild's peephole optimizer, which is run when minification is enabled. The incorrect rule transformed
if(a && falsy)
intoif(a, falsy)
which is equivalent iffalsy
has no side effects (such as the literalfalse
). However, the rule didn't check that the expression is side-effect free first which could result in miscompiled code. I have removed the rule instead of modifying it to check for the lack of side effects first because while the code is slightly smaller, it may also be more expensive at run-time which is undesirable. The size savings are also very insignificant. -
Change how
NODE_PATH
works to match node (#1117)Node searches for packages in nearby
node_modules
directories, but it also allows you to inject extra directories to search for packages in using theNODE_PATH
environment variable. This is supported when using esbuild's CLI as well as via thenodePaths
option when using esbuild's API.Node's module resolution algorithm is well-documented, and esbuild's path resolution is designed to follow it. The full algorithm is here: https://nodejs.org/api/modules.html#modules_all_together. However, it appears that the documented algorithm is incorrect with regard to
NODE_PATH
. The documentation saysNODE_PATH
directories should take precedence overnode_modules
directories, and so that's how esbuild worked. However, in practice node actually does it the other way around.Starting with this release, esbuild will now allow
node_modules
directories to take precedence overNODE_PATH
directories. This is a deviation from the published algorithm. -
Provide a better error message for incorrectly-quoted JSX attributes (#959, #1115)
People sometimes try to use the output of
JSON.stringify()
as a JSX attribute when automatically-generating JSX code. Doing so is incorrect because JSX strings work like XML instead of like JS (since JSX is XML-in-JS). Specifically, using a backslash before a quote does not cause it to be escaped:// JSX ends the "content" attribute here and sets "content" to 'some so-called \\' // v let button = <Button content="some so-called \"button text\"" /> // ^ // There is no "=" after the JSX attribute "text", so we expect a ">"
It's not just esbuild; Babel and TypeScript also treat this as a syntax error. All of these JSX parsers are just following the JSX specification. This has come up twice now so it could be worth having a dedicated error message. Previously esbuild had a generic syntax error like this:
> example.jsx:1:58: error: Expected ">" but found "\\" 1 │ let button = <Button content="some so-called \"button text\"" /> ╵ ^
Now esbuild will provide more information if it detects this case:
> example.jsx:1:58: error: Unexpected backslash in JSX element 1 │ let button = <Button content="some so-called \"button text\"" /> ╵ ^ example.jsx:1:45: note: Quoted JSX attributes use XML-style escapes instead of JavaScript-style escapes 1 │ let button = <Button content="some so-called \"button text\"" /> │ ~~ ╵ " example.jsx:1:29: note: Consider using a JavaScript string inside {...} instead of a quoted JSX attribute 1 │ let button = <Button content="some so-called \"button text\"" /> │ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ╵ {"some so-called \"button text\""}
v0.11.5
-
Add support for the
override
keyword in TypeScript 4.3 (#1105)The latest version of TypeScript (now in beta) adds a new keyword called
override
that can be used on class members. You can read more about this feature in Microsoft's blog post about TypeScript 4.3. It looks like this:class SpecializedComponent extends SomeComponent { override show() { // ... } }
With this release, esbuild will now ignore the
override
keyword when parsing TypeScript code instead of treating this keyword as a syntax error, which means esbuild can now support TypeScript 4.3 syntax. This change was contributed by @g-plane. -
Allow
async
pluginsetup
functionsWith this release, you can now return a promise from your plugin's
setup
function to delay the start of the build:let slowInitPlugin = { name: 'slow-init', async setup(build) { // Delay the start of the build await new Promise(r => setTimeout(r, 1000)) }, }
This is useful if your plugin needs to do something asynchronous before the build starts. For example, you may need some asynchronous information before modifying the
initialOptions
object, which must be done before the build starts for the modifications to take effect. -
Add some optimizations around hashing
This release contains two optimizations to the hashes used in output file names:
-
Hash generation now happens in parallel with other work, and other work only blocks on the hash computation if the hash ends up being needed (which is only if
[hash]
is included in--entry-names=
, and potentially--chunk-names=
if it's relevant). This is a performance improvement because--entry-names=
does not include[hash]
in the default case, so bundling time no longer always includes hashing time. -
The hashing algorithm has been changed from SHA1 to xxHash (specifically this Go implementation) which means the hashing step is around 6x faster than before. Thanks to @Jarred-Sumner for the suggestion.
-
-
Disable tree shaking annotations when code splitting is active (#1070, #1081)
Support for Webpack's
"sideEffects": false
annotation inpackage.json
is now disabled when code splitting is enabled and there is more than one entry point. This avoids a bug that could cause generated chunks to reference each other in some cases. Now all chunks generated by code splitting should be acyclic.
v0.11.4
-
Avoid name collisions with TypeScript helper functions (#1102)
Helper functions are sometimes used when transforming newer JavaScript syntax for older browsers. For example,
let {x, ...y} = {z}
is transformed intolet _a = {z}, {x} = _a, y = __rest(_a, ["x"])
which uses the__rest
helper function. Many of esbuild's transforms were modeled after the transforms in the TypeScript compiler, so many of the helper functions use the same names as TypeScript's helper functions.However, the TypeScript compiler doesn't avoid name collisions with existing identifiers in the transformed code. This means that post-processing esbuild's output with the TypeScript compiler (e.g. for lowering ES6 to ES5) will cause issues since TypeScript will fail to call its own helper functions: microsoft/TypeScript#43296. There is also a problem where TypeScript's
tslib
library overwrites globals with these names, which can overwrite esbuild's helper functions if code bundled with esbuild is run in the global scope.To avoid these problems, esbuild will now use different names for its helper functions.
-
Fix a chunk hashing issue (#1099)
Previously the chunk hashing algorithm skipped hashing entry point chunks when the
--entry-names=
setting doesn't contain[hash]
, since the hash wasn't used in the file name. However, this is no longer correct with the change in version 0.11.0 that made dynamic entry point chunks use--chunk-names=
instead of--entry-names=
since--chunk-names=
can still contain[hash]
.With this release, chunk contents will now always be hashed regardless of the chunk type. This makes esbuild somewhat slower than before in the common case, but it fixes this correctness issue.
v0.11.3
-
Auto-define
process.env.NODE_ENV
when platform is set tobrowser
All code in the React world has the requirement that the specific expression
process.env.NODE_ENV
must be replaced with a string at compile-time or your code will immediately crash at run-time. This is a common stumbling point for people when they start using esbuild with React. Previously bundling code with esbuild containingprocess.env.NODE_ENV
without defining a string replacement first was a warning that warned you about the lack of a define.With this release esbuild will now attempt to define
process.env.NODE_ENV
automatically instead of warning about it. This will be implicitly defined to"production"
if minification is enabled and"development"
otherwise. This automatic behavior only happens when the platform isbrowser
, sinceprocess
is not a valid browser API and will never exist in the browser. This is also only done if there are no existing defines forprocess
,process.env
, orprocess.env.NODE_ENV
so you can override the automatic value if necessary. If you need to disable this behavior, you can use theneutral
platform instead of thebrowser
platform. -
Retain side-effect free intermediate re-exporting files (#1088)
This fixes a subtle bug with esbuild's support for Webpack's
"sideEffects": false
annotation inpackage.json
when combined with re-export statements. A re-export is when you import something from one file and then export it again. You can re-export something withexport * from
orexport {foo} from
orimport {foo} from
followed byexport {foo}
.The bug was that files which only contain re-exports and that are marked as being side-effect free were not being included in the bundle if you import one of the re-exported symbols. This is because esbuild's implementation of re-export linking caused the original importing file to "short circuit" the re-export and just import straight from the file containing the final symbol, skipping the file containing the re-export entirely.
This was normally not observable since the intermediate file consisted entirely of re-exports, which have no side effects. However, a recent change to allow ESM files to be lazily-initialized relies on all intermediate files being included in the bundle to trigger the initialization of the lazy evaluation wrappers. So the behavior of skipping over re-export files is now causing the imported symbols to not be initialized if the re-exported file is marked as lazily-evaluated.
The fix is to track all re-exports in the import chain from the original file to the file containing the final symbol and then retain all of those statements if the import ends up being used.
-
Add a very verbose
debug
log levelThis log level is an experiment. Enabling it logs a lot of information (currently only about path resolution). The idea is that if you are having an obscure issue, the debug log level might contain some useful information. Unlike normal logs which are meant to mainly provide actionable information, these debug logs are intentionally mostly noise and are designed to be searched through instead.
Here is an example of debug-level log output:
> debug: Resolving import "react" in directory "src" of type "import-statement" note: Read 26 entries for directory "src" note: Searching for "react" in "node_modules" directories starting from "src" note: Attempting to load "src/react" as a file note: Failed to find file "src/react" note: Failed to find file "src/react.tsx" note: Failed to find file "src/react.ts" note: Failed to find file "src/react.js" note: Failed to find file "src/react.css" note: Failed to find file "src/react.svg" note: Attempting to load "src/react" as a directory note: Failed to read directory "src/react" note: Parsed package name "react" and package subpath "." note: Checking for a package in the directory "node_modules/react" note: Read 7 entries for directory "node_modules/react" note: Read 393 entries for directory "node_modules" note: Attempting to load "node_modules/react" as a file note: Failed to find file "node_modules/react" note: Failed to find file "node_modules/react.tsx" note: Failed to find file "node_modules/react.ts" note: Failed to find file "node_modules/react.js" note: Failed to find file "node_modules/react.css" note: Failed to find file "node_modules/react.svg" note: Attempting to load "node_modules/react" as a directory note: Read 7 entries for directory "node_modules/react" note: Resolved to "node_modules/react/index.js" using the "main" field in "node_modules/react/package.json" note: Read 7 entries for directory "node_modules/react" note: Read 7 entries for directory "node_modules/react" note: Primary path is "node_modules/react/index.js" in namespace "file"
v0.11.2
-
Fix missing symbol dependency for wrapped ESM files (#1086)
An internal graph node was missing an edge, which could result in generating code that crashes at run-time when code splitting is enabled. Specifically a part containing an import statement must depend on the imported file's wrapper symbol if the imported file is wrapped, regardless of whether it's a wrapped CommonJS or ESM file. Previously this was only the case for CommonJS files but not for ESM files, which is incorrect. This bug has been fixed.
-
Fix an edge case with entry points and top-level await
If an entry point uses
import()
on itself, it currently has to be wrapped sinceimport()
expressions call the wrapper for the imported file. This means the another call to the wrapper must be inserted at the bottom of the entry point file to start the lazy evaluation of the entry point code (otherwise nothing will be evaluated, since the entry point is wrapped). However, if this entry point then contains a top-level await that means the wrapper isasync
and must be passed toawait
to catch and forward any exceptions thrown during the evaluation of the entry point code. Thisawait
was previously missing in this specific case due to a bug, but theawait
should now be added in this release.
v0.11.1
-
Fix a missing space before internal
import()
when minifying (#1082)Internal
import()
of a CommonJS module inside the bundle turns into a call toPromise.resolve().then(() => require())
. However, a space was not inserted before thePromise
token when minifying, which could lead to a syntax error. This bug has been fixed. -
Fix code generation for unused imported files without side effects (#1080)
When esbuild adds a wrapping closure around a file to turn it from a statically-initialized file to a dynamically-initialized file, it also needs to turn import statements in other files that import the wrapped file into calls to the wrapper so that the wrapped file is initialized in the correct ordering. However, although tree-shaking is disabled for wrapped CommonJS files because CommonJS exports are dynamic, tree-shaking is still enabled for wrapped ESM files because ESM exports are static.
This caused a bug when files that have been marked with
"sideEffects": false
end up being completely unused in the resulting bundle. In that case the file is removed entirely, but esbuild was still turningimport
statements to that file into calls to the ESM wrapper. These wrapper calls should instead be omitted if the file was completely removed from the bundle as dead code. This bug has been fixed. -
Allow top-level await in supported environments
Top-level await (i.e. using the
await
keyword outside of anasync
function) is not yet part of the JavaScript language standard. The feature proposal is still at stage 3 and has not yet advanced to stage 4. However, V8 has already implemented it and it has shipped in Chrome 89 and node 14.8. This release allows top-level await to be used when the--target=
flag is set to those compilation targets. -
Convert
import()
torequire()
ifimport()
is not supported (#1084)This release now converts dynamic
import()
expressions intoPromise.resolve().then(() => require())
expressions if the compilation target doesn't support them. This is the case for node before version 13.2, for example.
v0.11.0
This release contains backwards-incompatible changes. Since esbuild is before version 1.0.0, these changes have been released as a new minor version to reflect this (as recommended by npm). You should either be pinning the exact version of esbuild
in your package.json
file or be using a version range syntax that only accepts patch upgrades such as ~0.10.0
. See the documentation about semver for more information.
The changes in this release mostly relate to how entry points are handled. The way output paths are generated has changed in some cases, so you may need to update how you refer to the output path for a given entry point when you update to this release (see below for details). These breaking changes are as follows:
-
Change how
require()
andimport()
of ESM works (#667, #706)Previously if you call
require()
on an ESM file, or callimport()
on an ESM file with code splitting disabled, esbuild would convert the ESM file to CommonJS. For example, if you had the following input files:// cjs-file.js console.log(require('./esm-file.js').foo) // esm-file.js export let foo = bar()
The previous bundling behavior would generate something like this:
var require_esm_file = __commonJS((exports) => { __markAsModule(exports); __export(exports, { foo: () => foo }); var foo = bar(); }); console.log(require_esm_file().foo);
This behavior has been changed and esbuild now generates something like this instead:
var esm_file_exports = {}; __export(esm_file_exports, { foo: () => foo }); var foo; var init_esm_file = __esm(() => { foo = bar(); }); console.log((init_esm_file(), esm_file_exports).foo);
The variables have been pulled out of the lazily-initialized closure and are accessible to the rest of the module's scope. Some benefits of this approach:
-
If another file does
import {foo} from "./esm-file.js"
, it will just referencefoo
directly and will not pay the performance penalty or code size overhead of the dynamic property accesses that come with CommonJS-style exports. So this improves performance and reduces code size in some cases. -
This fixes a long-standing bug (#706) where entry point exports could be broken if the entry point is a target of a
require()
call and the output format was ESM. This happened because previously callingrequire()
on an entry point converted it to CommonJS, which then meant it only had a singledefault
export, and the exported variables were inside the CommonJS closure and inaccessible to an ESM-styleexport {}
clause. Now callingrequire()
on an entry point only causes it to be lazily-initialized but all exports are still in the module scope and can still be exported using a normalexport {}
clause. -
Now that this has been changed,
import()
of a module with top-level await (#253) is now allowed when code splitting is disabled. Previously this didn't work becauseimport()
with code splitting disabled was implemented by converting the module to CommonJS and usingPromise.resolve().then(() => require())
, but converting a module with top-level await to CommonJS is impossible because the CommonJS call signature must be synchronous. Now that this implemented using lazy initialization instead of CommonJS conversion, the closure wrapping the ESM file can now beasync
and theimport()
expression can be replaced by a call to the lazy initializer. -
Adding the ability for ESM files to be lazily-initialized is an important step toward additional future code splitting improvements including: manual chunk names (#207), correct import evaluation order (#399), and correct top-level await evaluation order (#253). These features all need to make use of deferred evaluation of ESM code.
In addition, calling
require()
on an ESM file now recursively wraps all transitive dependencies of that file instead of just wrapping that ESM file itself. This is an increase in the size of the generated code, but it is important for correctness (#667). Callingrequire()
on a module means its evaluation order is determined at run-time, which means the evaluation order of all dependencies must also be determined at run-time. If you don't want the increase in code size, you should use animport
statement instead of arequire()
call. -
-
Dynamic imports now use chunk names instead of entry names (#1056)
Previously the output paths of dynamic imports (files imported using the
import()
syntax) were determined by the--entry-names=
setting. However, this can cause problems if you configure the--entry-names=
setting to omit both[dir]
and[hash]
because then two dynamic imports with the same name will cause an output file name collision.Now dynamic imports use the
--chunk-names=
setting instead, which is used for automatically-generated chunks. This setting is effectively required to include[hash]
so dynamic import name collisions should now be avoided.In addition, dynamic imports no longer affect the automatically-computed default value of
outbase
. By defaultoutbase
is computed to be the lowest common ancestor directory of all entry points. Previously dynamic imports were considered entry points in this calculation so adding a dynamic entry point could unexpectedly affect entry point output file paths. This issue has now been fixed. -
Allow custom output paths for individual entry points
By default, esbuild will automatically generate an output path for each entry point by computing the relative path from the
outbase
directory to the entry point path, and then joining that relative path to theoutdir
directory. The output path can be customized usingoutpath
, but that only works for a single file. Sometimes you may need custom output paths while using multiple entry points. You can now do this by passing the entry points as a map instead of an array:-
CLI
esbuild out1=in1.js out2=in2.js --outdir=out
-
JS
esbuild.build({ entryPoints: { out1: 'in1.js', out2: 'in2.js', }, outdir: 'out', })
-
Go
api.Build(api.BuildOptions{ EntryPointsAdvanced: []api.EntryPoint{{ OutputPath: "out1", InputPath: "in1.js", }, { OutputPath: "out2", InputPath: "in2.js", }}, Outdir: "out", })
This will cause esbuild to generate the files
out/out1.js
andout/out2.js
inside the output directory. These custom output paths are used as input for the--entry-names=
path template setting, so you can use something like--entry-names=[dir]/[name]-[hash]
to add an automatically-computed hash to each entry point while still using the custom output path. -
-
Derive entry point output paths from the original input path (#945)
Previously esbuild would determine the output path for an entry point by looking at the post-resolved path. For example, running
esbuild --bundle react --outdir=out
would generate the output pathout/index.js
because the input pathreact
was resolved tonode_modules/react/index.js
. With this release, the output path is now determined by looking at the pre-resolved path. For example, runningesbuild --bundle react --outdir=out
now generates the output pathout/react.js
. If you need to keep using the output path that esbuild previously generated with the old behavior, you can use the custom output path feature (described above). -
Use the
file
namespace for file entry points (#791)Plugins that contain an
onResolve
callback with thefile
filter don't apply to entry point paths because it's not clear that entry point paths are files. For example, you could potentially bundle an entry point ofhttps://www.example.com/file.js
with a HTTP plugin that automatically downloads data from the server at that URL. But this behavior can be unexpected for people writing plugins.With this release, esbuild will do a quick check first to see if the entry point path exists on the file system before running plugins. If it exists as a file, the namespace will now be
file
for that entry point path. This only checks the exact entry point name and doesn't attempt to search for the file, so for example it won't handle cases where you pass a package path as an entry point or where you pass an entry point without an extension. Hopefully this should help improve this situation in the common case where the entry point is an exact path.
In addition to the breaking changes above, the following features are also included in this release:
-
Warn about mutation of private methods (#1067)
Mutating a private method in JavaScript is not allowed, and will throw at run-time:
class Foo { #method() {} mutate() { this.#method = () => {} } }
This is the case both when esbuild passes the syntax through untransformed and when esbuild transforms the syntax into the equivalent code that uses a `We...
v0.10.2
-
Fix a crash that was introduced in the previous release (#1064)
This crash happens when code splitting is active and there is a CSS entry point as well as two or more JavaScript entry points. There is a known issue where CSS bundling does not work when code splitting is active (code splitting is still a work in progress, see #608) so doing this will likely not work as expected. But esbuild obviously shouldn't crash. This release fixes the crash, although esbuild still does not yet generate the correct CSS output in this case.
-
Fix private fields inside destructuring assignment (#1066)
Private field syntax (i.e.
this.#field
) is supported for older language targets by converting the code into accesses into aWeakMap
. However, although regular assignment (i.e.this.#field = 1
) was handled destructuring assignment (i.e.[this.#field] = [1]
) was not handled due to an oversight. Support for private fields inside destructuring assignment is now included with this release. -
Fix an issue with direct
eval
and top-level symbolsIt was previously the case that using direct
eval
caused the file containing it to be considered a CommonJS file, even if the file used ESM syntax. This was because the evaluated code could potentially attempt to interact with top-level symbols by name and the CommonJS closure was used to isolate those symbols from other modules so their names could be preserved (otherwise their names may need to be renamed to avoid collisions). However, ESM files are no longer convertable to CommonJS files due to the need to support top-level await.This caused a bug where scope hoisting could potentially merge two modules containing direct
eval
and containing the same top-level symbol name into the same scope. These symbols were prevented from being renamed due to the directeval
, which caused a syntax error at run-time due to the name collision.Because of this, esbuild is dropping the guarantee that using direct
eval
in an ESM file will be able to access top-level symbols. These symbols are now free to be renamed to avoid name collisions, and will now be minified when identifier minification is enabled. This is unlikely to affect real-world code because most real-world uses of directeval
only attempt to access local variables, not top-level symbols.Using direct
eval
in an ESM file when bundling with esbuild will generate a warning. The warning is not new and is present in previous releases of esbuild as well. The way to avoid the warning is to avoid directeval
, since directeval
is somewhat of an anti-pattern and there are better alternatives.