fix: use @babel/preset-env with bugfixes for modern builds (#702)

.changeset/lucky-insects-shop.md

@@ -0,0 +1,5 @@
+---
+'microbundle': patch
+---
+
+Use @babel/preset-env with bugfixes instead of preset-modules to enable "Optional chaining" & "nullish coalescing" by default.

package.json

@@ -79,9 +79,8 @@
     "@babel/plugin-transform-flow-strip-types": "^7.10.1",
     "@babel/plugin-transform-react-jsx": "^7.10.1",
     "@babel/plugin-transform-regenerator": "^7.10.1",
-    "@babel/preset-env": "^7.10.2",
+    "@babel/preset-env": "^7.11.0",
     "@babel/preset-flow": "^7.10.1",
-    "@babel/preset-modules": "^0.1.3",
     "@rollup/plugin-alias": "^3.1.1",
     "@rollup/plugin-babel": "^5.0.3",
     "@rollup/plugin-commonjs": "^13.0.0",
@@ -118,7 +117,6 @@
   "devDependencies": {
     "@babel/cli": "^7.10.1",
     "@babel/node": "^7.10.1",
-    "@babel/plugin-proposal-optional-chaining": "^7.10.1",
     "@babel/plugin-proposal-throw-expressions": "^7.10.1",
     "@changesets/changelog-github": "^0.2.6",
     "@changesets/cli": "^2.9.2",

src/lib/babel-custom.js

@@ -46,7 +46,8 @@ const createConfigItems = (babel, type, items) => {
 	});
 };
 
-const presetEnvRegex = RegExp(/@babel\/(preset-)?env/);
+const environmentPreset = '@babel/preset-env';
+const presetEnvRegex = new RegExp(environmentPreset);
 
 export default () => {
 	return createBabelInputPluginFactory(babelCore => {
@@ -125,10 +126,6 @@ export default () => {
 					presetEnvRegex.test(preset.file.request),
 				);
 
-				const environmentPreset = customOptions.modern
-					? '@babel/preset-modules'
-					: '@babel/preset-env';
-
 				if (envIdx !== -1) {
 					const preset = babelOptions.presets[envIdx];
 					babelOptions.presets[envIdx] = babelCore.createConfigItem(
@@ -143,6 +140,7 @@ export default () => {
 									},
 									preset.options,
 									{
+										bugfixes: customOptions.modern,
 										modules: false,
 										exclude: merge(
 											['transform-async-to-generator', 'transform-regenerator'],
@@ -167,6 +165,7 @@ export default () => {
 							modules: false,
 							loose: true,
 							useBuiltIns: false,
+							bugfixes: customOptions.modern,
 							exclude: [
 								'transform-async-to-generator',
 								'transform-regenerator',

test/__snapshots__/index.test.js.snap

@@ -2273,12 +2273,12 @@ optional-chaining-ts
 
 
 Build \\"optionalChainingTs\\" to dist:
-104 B: optional-chaining-ts.js.gz
-77 B: optional-chaining-ts.js.br
-108 B: optional-chaining-ts.esm.js.gz
-92 B: optional-chaining-ts.esm.js.br
-207 B: optional-chaining-ts.umd.js.gz
-166 B: optional-chaining-ts.umd.js.br"
+109 B: optional-chaining-ts.js.gz
+88 B: optional-chaining-ts.js.br
+111 B: optional-chaining-ts.esm.js.gz
+97 B: optional-chaining-ts.esm.js.br
+211 B: optional-chaining-ts.umd.js.gz
+170 B: optional-chaining-ts.umd.js.br"
 `;
 
 exports[`fixtures build optional-chaining-ts with microbundle 2`] = `7`;
@@ -2293,19 +2293,19 @@ exports[`fixtures build optional-chaining-ts with microbundle 3`] = `
 `;
 
 exports[`fixtures build optional-chaining-ts with microbundle 4`] = `
-"function n(n){var r;return null===(r=n.maybeVar)||void 0===r?void 0:r.thing}export{n as chain};
+"function n(n){var r,i;return null!=(r=null==(i=n.maybeVar)?void 0:i.thing)?r:void 0}export{n as chain};
 //# sourceMappingURL=optional-chaining-ts.esm.js.map
 "
 `;
 
 exports[`fixtures build optional-chaining-ts with microbundle 5`] = `
-"exports.chain=function(n){var i;return null===(i=n.maybeVar)||void 0===i?void 0:i.thing};
+"exports.chain=function(n){var i,r;return null!=(i=null==(r=n.maybeVar)?void 0:r.thing)?i:void 0};
 //# sourceMappingURL=optional-chaining-ts.js.map
 "
 `;
 
 exports[`fixtures build optional-chaining-ts with microbundle 6`] = `
-"!function(n,e){\\"object\\"==typeof exports&&\\"undefined\\"!=typeof module?e(exports):\\"function\\"==typeof define&&define.amd?define([\\"exports\\"],e):e((n=n||self).optionalChainingTs={})}(this,function(n){n.chain=function(n){var e;return null===(e=n.maybeVar)||void 0===e?void 0:e.thing}});
+"!function(n,e){\\"object\\"==typeof exports&&\\"undefined\\"!=typeof module?e(exports):\\"function\\"==typeof define&&define.amd?define([\\"exports\\"],e):e((n=n||self).optionalChainingTs={})}(this,function(n){n.chain=function(n){var e,i;return null!=(e=null==(i=n.maybeVar)?void 0:i.thing)?e:void 0}});
 //# sourceMappingURL=optional-chaining-ts.umd.js.map
 "
 `;

test/fixtures/optional-chaining-ts/src/index.ts

@@ -1,3 +1,5 @@
-export function chain(test: { maybeVar?: { thing: string } }): string | undefined {
-	return test.maybeVar?.thing;
+export function chain(test: {
+	maybeVar?: { thing: string };
+}): string | undefined {
+	return test.maybeVar?.thing ?? undefined;
 }