Generate ES2017 in development (#1580)

Author: developit

.changeset/breezy-bottles-hammer.md

@@ -0,0 +1,5 @@
+---
+"preact-cli": minor
+---
+
+Generate modern (approximately ES2017) code in development mode to better match production output.

packages/cli/babel/index.js

@@ -6,9 +6,24 @@ var isProd = (process.env.BABEL_ENV || process.env.NODE_ENV) === 'production';
  */
 var isTest = (process.env.BABEL_ENV || process.env.NODE_ENV) === 'test';
 
-// default supported browser.
+// default supported browsers for prod nomodule bundles:
 var defaultBrowserList = ['> 0.25%', 'IE >= 9'];
 
+// default supported browsers for all dev bundles (module/nomodule is not used):
+// see https://github.com/babel/babel/blob/master/packages/babel-compat-data/data/native-modules.json
+var defaultBrowserListDev = [
+	'chrome >= 61',
+	'and_chr >= 61',
+	'android >= 61',
+	'firefox >= 60',
+	'and_ff >= 60',
+	'safari >= 10.1',
+	'ios_saf >= 10.3',
+	'edge >= 16',
+	'opera >= 48',
+	'samsung >= 8.2'
+];
+
 // preact-cli babel configs
 var babelConfigs = require('../lib/lib/babel-config');
 
@@ -21,7 +36,7 @@ module.exports = function preactCli(ctx, userOptions = {}) {
 	var presetOptions = {
 		env: isProd ? 'production' : 'development',
 		modules: isTest ? 'commonjs' : false,
-		browsers: defaultBrowserList,
+		browsers: isProd ? defaultBrowserList : defaultBrowserListDev,
 	};
 
 	// user specified options always the strongest

packages/cli/lib/lib/babel-config.js

@@ -6,7 +6,7 @@ module.exports = function (env, options = {}) {
 			[
 				require.resolve('@babel/preset-env'),
 				{
-					loose: true,
+					bugfixes: true,
 					modules: options.modules || false,
 					targets: {
 						browsers: options.browsers,
@@ -19,10 +19,7 @@ module.exports = function (env, options = {}) {
 			require.resolve('@babel/plugin-syntax-dynamic-import'),
 			require.resolve('@babel/plugin-transform-object-assign'),
 			[require.resolve('@babel/plugin-proposal-decorators'), { legacy: true }],
-			[
-				require.resolve('@babel/plugin-proposal-class-properties'),
-				{ loose: true },
-			],
+			require.resolve('@babel/plugin-proposal-class-properties'),
 			require.resolve('@babel/plugin-proposal-object-rest-spread'),
 			isProd &&
 				require.resolve('babel-plugin-transform-react-remove-prop-types'),

packages/cli/tests/service-worker.test.js

@@ -91,7 +91,7 @@ describe('preact service worker tests', () => {
 		);
 		// eslint-disable-next-line no-useless-escape
 		expect(swText).toMatch(
-			/caches.match\(\w\("\/200.html"\)\|\|\w\("\/index.html"\)/
+			/caches.match\(\w+\("\/200.html"\)\|\|\w+\("\/index.html"\)/
 		);
 		const page = await browser.newPage();
 		await page.setCacheEnabled(false);