aspirational approach to differential bundling

.babelrc

@@ -0,0 +1,9 @@
+{
+	"presets": ["@babel/preset-env"],
+	"plugins": [
+		"@babel/plugin-syntax-dynamic-import",
+		["@babel/plugin-transform-runtime", {
+			"useESModules": true
+		}]
+	]
+}

package.json

@@ -18,9 +18,15 @@
     "sirv": "^0.2.0"
   },
   "devDependencies": {
+    "@babel/core": "^7.0.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
+    "@babel/plugin-transform-runtime": "^7.0.0",
+    "@babel/preset-env": "^7.0.0",
+    "@babel/runtime": "^7.0.0",
     "chokidar": "^2.0.4",
     "npm-run-all": "^4.1.2",
     "rollup": "^0.65.0",
+    "rollup-plugin-babel": "^4.0.2",
     "rollup-plugin-commonjs": "^9.1.6",
     "rollup-plugin-loadz0r": "^0.3.0",
     "rollup-plugin-node-resolve": "^3.3.0",

rollup/client.config.js

@@ -2,11 +2,13 @@ import resolve from 'rollup-plugin-node-resolve';
 import replace from 'rollup-plugin-replace';
 import commonjs from 'rollup-plugin-commonjs';
 import svelte from 'rollup-plugin-svelte';
+import babel from 'rollup-plugin-babel';
 import { terser } from 'rollup-plugin-terser';
 import config from 'sapper/config/rollup.js';
 
 const mode = process.env.NODE_ENV;
 const dev = mode === 'development';
+const legacy = process.env.SAPPER_LEGACY_BUILD;
 
 export default {
 	input: config.client.input(),
@@ -23,6 +25,15 @@ export default {
 			hydratable: true
 		}),
 
+		legacy && babel({
+			extensions: ['.js', '.html'],
+			include: [
+				'app/**',
+				'routes/**'
+			],
+			runtimeHelpers: true
+		}),
+
 		!dev && terser({
 			module: true
 		})

routes/blog/index.html

@@ -23,10 +23,9 @@
 
 <script>
 	export default {
-		preload({ params, query }) {
+		async preload({ params, query }) {
-			return this.fetch(`blog.json`).then(r => r.json()).then(posts => {
+			const posts = await this.fetch(`blog.json`).then(r => r.json());
-				return { posts };
+			return { posts };
-			});
 		}
 	};
 </script>