Code splitting does not enforce strict mode

[Ventajou]

When using code splitting and dynamic imports, the only format actually producing chunks is esm right now. So the resulting entry point needs to be loaded with a <script type="module"... element. However, the module type forces scripts to be loaded in strict mode.

I ran into this scenario because some library from npm uses the with statement. That statement is forbidden in strict mode but esbuild doesn't account for that, resulting in an invalid output that will cause an error in the browser.

I have put together an example repo: https://github.com/Ventajou/esbuild-import

No idea if there are more cases like this, I'm hopng it's relatively easy for esbuild to remove with because right now I have no way around this..

[lukeed]

The ESM format itself invokes strict mode

[Ventajou]

@lukeed that's the problem, a with statement is not accepted in strict mode

[lukeed]

Right, but that's not a bundler/code-splitting issue. It's an intentional design feature of ESM altogether. So unless/until SystemJS is supported (#192), I don't think you're going to be able to use that dependency and splitting: true (or even format: 'esm') at the same time.

[evanw]

I'm currently working on an overhaul of code splitting which will add support for code splitting with the iife format too. That might get this to work. Stay tuned on #16 for when that is implemented.

It's true that esbuild doesn't currently enforce strict mode at compile time. You should be able to use other tools for that though such as a linter. It should be possible to set one up to reject things like this so they don't make it into your source code in the first place.

FWIW the with statement is a well known JavaScript anti-pattern in all but a very, very small set of highly specific use cases. I have been doing web development for around two decades and I have only ever seen one good use of it, and it was for a massive hack where there was no other option. And even for that it was only used once in a very small piece of code.

Doing with (Math) return cos(v) is not a good reason to use the with statement. Using the with statement has very real negative impacts on run-time performance and on JavaScript code size optimization since it prevents tools from making any inferences about the binding of identifiers within the with scope.

I'm hopng it's relatively easy for esbuild to remove with because right now I have no way around this.

There isn't an easy way of transforming JavaScript that uses with to JavaScript that does not use with. And even if there was, I'm not interested in putting something like that into esbuild itself because it's already an anti-pattern that shouldn't be used.

[lukeed]

I'm currently working on an overhaul of code splitting which will add support for code splitting with the iife format too. That might get this to work.

Very cool, congrats!