Generates Broken CommonJS From Typescript
Author: 1ux0Created May 24, 2024Updated May 25, 2024
Microbundle creates broken CommonJS code when compiling from Typescript.
The continue keyword in the following code is not respected in the compiled CommonJS code.
async function brokenContinue() {
let j = 0;
while (j <= 3) {
j++;
console.log("AT THE TOP");
if (j === 1) {
console.log("\t- j === 1");
console.log("\t- waiting for 100ms");
await new Promise((resolve) => setTimeout(resolve, 100));
console.log('\t- continue, next log will be "AT THE TOP"');
continue;
}
console.log("AT THE BOTTOM");
}
}
void brokenContinue();The output is:
$ node dist/index.cjs
AT THE TOP
- j === 1
- waiting for 100ms
- continue, next log will be "AT THE TOP"
AT THE BOTTOM <------- THIS SHOULD READ "AT THE TOP"
AT THE TOP
AT THE BOTTOM
AT THE TOP
AT THE BOTTOM
AT THE TOP
AT THE BOTTOMThe problem is caused by the usage of async/await within the while loop. Commenting out: await new Promise((resolve) => setTimeout(resolve, 100)); produces the expected result.
Notes:
- Compiling using
tscgenerates JS that works correctly. - Compiling to modern JS generates code that works correctly.
Here's a repo containing the setup that caused the issue: https://github.com/luxo-ai/breakjs
Source: developit/microbundle