Modern JS

package.json

@@ -51,7 +51,7 @@
     "@babel/preset-flow": "^7.0.0",
     "asyncro": "^3.0.0",
     "autoprefixer": "^9.5.1",
-    "babel-plugin-transform-async-to-promises": "^0.8.10",
+    "babel-plugin-transform-async-to-promises": "^0.8.11",
     "babel-plugin-transform-replace-expressions": "^0.2.0",
     "brotli-size": "^0.1.0",
     "camelcase": "^5.3.1",

src/index.js

@@ -418,9 +418,15 @@ function createConfig(options, entry, format, writeMeta) {
 			: pkg['jsnext:main'] || 'x.mjs',
 		mainNoExtension,
 	);
+	let modernMain = replaceName(
+		(pkg.syntax && pkg.syntax.esmodules) || pkg.esmodule || 'x.modern.mjs',
+		mainNoExtension,
+	);
 	let cjsMain = replaceName(pkg['cjs:main'] || 'x.js', mainNoExtension);
 	let umdMain = replaceName(pkg['umd:main'] || 'x.umd.js', mainNoExtension);
 
+	const modern = format === 'modern';
+
 	// let rollupName = safeVariableName(basename(entry).replace(/\.js$/, ''));
 
 	let nameCache = {};
@@ -560,7 +566,11 @@ function createConfig(options, entry, format, writeMeta) {
 									loose: true,
 									modules: false,
 									targets:
-										options.target === 'node' ? { node: '8' } : undefined,
+										options.target === 'node'
+											? { node: '8' }
+											: modern
+											? { esmodules: true }
+											: undefined,
 									exclude: ['transform-async-to-generator'],
 								},
 							],
@@ -578,15 +588,15 @@ function createConfig(options, entry, format, writeMeta) {
 								require.resolve('babel-plugin-transform-replace-expressions'),
 								{ replace: defines },
 							],
-							[
+							!modern && [
 								require.resolve('babel-plugin-transform-async-to-promises'),
 								{ inlineHelpers: true, externalHelpers: true },
 							],
 							[
 								require.resolve('@babel/plugin-proposal-class-properties'),
 								{ loose: true },
 							],
-						],
+						].filter(Boolean),
 					}),
 					options.compress !== false && [
 						terser({
@@ -601,8 +611,8 @@ function createConfig(options, entry, format, writeMeta) {
 								minifyOptions.compress || {},
 							),
 							warnings: true,
-							ecma: 5,
-							toplevel: format === 'cjs' || format === 'es',
+							ecma: modern ? 8 : 5,
+							toplevel: modern || format === 'cjs' || format === 'es',
 							mangle: Object.assign({}, minifyOptions.mangle || {}),
 							nameCache,
 						}),
@@ -644,13 +654,19 @@ function createConfig(options, entry, format, writeMeta) {
 			get banner() {
 				return shebang[options.name];
 			},
-			format,
+			format: modern ? 'es' : format,
 			name: options.name,
 			file: resolve(
 				options.cwd,
-				(format === 'es' && moduleMain) ||
-					(format === 'umd' && umdMain) ||
-					cjsMain,
+				{
+					modern: modernMain,
+					es: moduleMain,
+					umd: umdMain,
+				}[format] || cjsMain,
+				// (format === 'modern' && modernMain) ||
+				// 	(format === 'es' && moduleMain) ||
+				// 	(format === 'umd' && umdMain) ||
+				// 	cjsMain,
 			),
 		},
 	};

src/prog.js

@@ -4,6 +4,10 @@ let { version } = require('../package');
 const toArray = val => (Array.isArray(val) ? val : val == null ? [] : [val]);
 
 export default handler => {
+	const ENABLE_MODERN = process.env.MICROBUNDLE_MODERN !== 'false';
+
+	const DEFAULT_FORMATS = ENABLE_MODERN ? 'modern,es,cjs,umd' : 'es,cjs,umd';
+
 	const cmd = type => (str, opts) => {
 		opts.watch = opts.watch || type === 'watch';
 		opts.compress =
@@ -18,7 +22,7 @@ export default handler => {
 		.version(version)
 		.option('--entry, -i', 'Entry module(s)')
 		.option('--output, -o', 'Directory to place build files into')
-		.option('--format, -f', 'Only build specified formats', 'es,cjs,umd')
+		.option('--format, -f', 'Only build specified formats', DEFAULT_FORMATS)
 		.option('--watch, -w', 'Rebuilds on any change', false)
 		.option('--target', 'Specify your target environment (node or web)', 'web')
 		.option('--external', `Specify external dependencies, or 'none'`)

test/fixtures/modern/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "basic-lib",
+  "scripts": {
+    "build": "microbundle -f modern"
+  }
+}

test/fixtures/modern/src/index.js

@@ -0,0 +1,5 @@
+import { two } from './two';
+
+export default async function(...args) {
+	return [await two(...args), await two(...args)];
+}

test/fixtures/modern/src/two.js

@@ -0,0 +1,3 @@
+export async function two(...args) {
+	return args.reduce((total, value) => total + value, 0);
+}

test/index.test.js

@@ -58,6 +58,7 @@ describe('fixtures', () => {
 			// we don't realy care about the content of a sourcemap
 			files
 				.filter(file => !/\.map$/.test(file))
+				.sort(file => (/modern/.test(file) ? 1 : 0))
 				.forEach(file => {
 					expect(
 						fs.readFileSync(resolve(dist, file)).toString('utf8'),

tools/build-fixture.js

@@ -12,13 +12,18 @@ const FIXTURES_DIR = resolve(`${__dirname}/../test/fixtures`);
 const DEFAULT_SCRIPT = 'microbundle';
 
 const parseScript = (() => {
-	let parsed;
-	const prog = createProg(_parsed => (parsed = _parsed));
-
 	return script => {
+		let parsed;
+		const prog = createProg(_parsed => (parsed = _parsed));
 		const argv = shellQuote.parse(`node ${script}`);
+
+		// default to non-modern formats
+		let hasFormats = argv.some(arg => /^(--format|-f)$/.test(arg));
+		if (!hasFormats) argv.push('-f', 'es,cjs,umd');
+
 		// assuming {op: 'glob', pattern} for non-string args
 		prog(argv.map(arg => (typeof arg === 'string' ? arg : arg.pattern)));
+
 		return parsed;
 	};
 })();