merge master -> blog-post-css

Author: Rich-Harris

.gitignore

@@ -17,6 +17,8 @@ universal/components/guide-summary.json
 universal/routes/Repl/examples.js
 server/components
 server/routes
-server/manifests
+manifests
 credentials.json
-assets
+assets
+build
+server.js

client/rollup.config.codemirror.js

@@ -3,9 +3,9 @@
   "version": "1.0.0",
   "description": "Docs and examples for Svelte",
   "scripts": {
-    "start": "node server/dist",
-    "prebuild": "rm -rf client/dist && mkdir -p client/dist && rm -rf service-worker/dist && mkdir -p service-worker/dist",
-    "dev": "rollup -c -w & node scripts/prep && npm start",
+    "start": "node server",
+    "prebuild": "rm -rf build && mkdir -p build",
+    "dev": "node scripts/prep && rollup -c -w & npm start",
     "build": "node scripts/prep && rollup -c",
     "update_template": "sh ./scripts/update_template.sh",
     "zip": "sh ./scripts/zip.sh",
@@ -48,7 +48,7 @@
     "rollup-plugin-hash": "^1.2.0",
     "rollup-plugin-json": "^2.1.1",
     "rollup-plugin-node-resolve": "^3.0.0",
-    "rollup-plugin-replace": "^1.1.1",
+    "rollup-plugin-replace": "^2.0.0",
     "rollup-plugin-svelte": "^3.0.0",
     "rollup-plugin-uglify": "^2.0.1",
     "uglify-js": "^3.0.0"
@@ -71,17 +71,12 @@
   "now": {
     "alias": "svelte.technology",
     "files": [
-      "blog",
-      "client",
-      "examples",
-      "guide",
+      "content",
+      "src",
       "public",
       "rollup.config.js",
       "scripts",
-      "server",
-      "service-worker",
-      "templates",
-      "universal"
+      "manifests"
     ]
   }
 }

client/rollup.config.js

@@ -1,11 +1,163 @@
-import client from './client/rollup.config.js';
-import codemirror from './client/rollup.config.codemirror.js';
-import serviceWorker from './service-worker/rollup.config.js';
-import server from './server/rollup.config.js';
+import fs from 'fs';
+import glob from 'glob';
+import hasha from 'hasha';
+import hash from 'rollup-plugin-hash';
+import replace from 'rollup-plugin-replace';
+import svelte from 'rollup-plugin-svelte';
+import resolve from 'rollup-plugin-node-resolve';
+import commonjs from 'rollup-plugin-commonjs';
+import json from 'rollup-plugin-json';
+import uglify from 'rollup-plugin-uglify';
+import buble from 'rollup-plugin-buble';
+import pkg from './package.json';
+
+const dev = !!process.env.ROLLUP_WATCH;
+
+function readJson(file) {
+	return JSON.parse(fs.readFileSync(file, 'utf-8'));
+}
+
+const hashed = {
+	blog: readJson('manifests/content.json')['blog.json'],
+	guide: readJson('manifests/content.json')['guide.json']
+};
 
 export default [
-	client,
-	codemirror,
-	serviceWorker,
-	server
-];
+	/* bundle.js */
+	{
+		input: 'src/client/main.js',
+		output: {
+			file: 'build/bundle.js',
+			format: 'iife',
+		},
+		plugins: [
+			replace({
+				'blog.[hash].json': () => hashed.blog,
+				'guide.[hash].json': () => hashed.guide
+			}),
+			json(),
+			resolve(),
+			commonjs(),
+			svelte({
+				cascade: false,
+				css (css) {
+					if (dev) {
+						css.write(`build/main.css`);
+						hashed.css = 'main.css';
+					} else {
+						const hash = hasha(css.code, { algorithm: 'md5' });
+						hashed.css = `main.${hash}.css`;
+
+						css.write(`build/${hashed.css}`);
+						fs.writeFileSync(`manifests/css.json`, JSON.stringify({ 'main.css': hashed.css }));
+					}
+				}
+			}),
+			buble(),
+			!dev && hash({
+				dest: 'build/bundle.[hash].js',
+				manifest: 'manifests/bundle.json',
+				manifestKey: 'bundle.js'
+			}),
+			!dev && uglify()
+		],
+		sourcemap: true
+	},
+
+	/* codemirror.js */
+	{
+		input: 'src/client/codemirror.js',
+		output: {
+			file: 'public/codemirror.js',
+			format: 'amd',
+		},
+		plugins: [
+			resolve(),
+			commonjs(),
+			!dev && uglify()
+		],
+		sourcemap: true
+	},
+
+	/* sw.js */
+	{
+		input: 'src/service-worker/main.js',
+		output: {
+			file: 'build/sw.js',
+			format: 'iife',
+		},
+		plugins: [
+			replace({
+				__CACHEVERSION__: () => '' + Date.now(),
+				__MANIFEST__: generateCacheManifest,
+				delimiters: ['', '']
+			}),
+			buble(),
+			!dev && hash({
+				dest: 'build/sw.[hash].js',
+				manifest: 'manifests/sw.json',
+				manifestKey: 'sw.js'
+			}),
+			!dev && uglify()
+		],
+		sourcemap: true
+	},
+
+	/* server.js */
+	{
+		input: 'src/server/index.js',
+		output: {
+			file: 'server.js',
+			format: 'cjs',
+		},
+		external: Object.keys(pkg.dependencies).concat([
+			'path', 'fs'
+		]),
+		plugins: [
+			replace({
+				__dev__: !!dev,
+				'blog.[hash].json': hashed.blog,
+				'guide.[hash].json': hashed.guide
+			}),
+			json(),
+			svelte({
+				generate: 'ssr',
+				cascade: false,
+				css: false
+			})
+		]
+	}
+];
+
+function generateCacheManifest() {
+	// https://github.com/phamann/rollup-plugin-hash/issues/14
+	hashed.bundle = readJson('manifests/bundle.json')['bundle.js'].replace('build/', '');
+
+	const manifest = [].concat(
+		// routes
+		'/',
+		'/guide',
+		'/repl',
+		'/blog',
+
+		// js
+		`/${hashed.bundle}`,
+		'/curl.js',
+		'/codemirror.js',
+		'/magic-string.umd.js',
+
+		// css
+		`/${hashed.css}`,
+		'/codemirror.css',
+
+		// fonts
+		glob.sync('fonts/**/*.woff?(2)', { cwd: 'public' }).map(x => `/${x}`),
+
+		// content
+		`/${hashed.blog}`, // don't need to include individual posts
+		`/${hashed.guide}`,
+		glob.sync('examples/**/*.json', { cwd: 'public' }).map(x => `/${x}`)
+	);
+
+	return JSON.stringify(manifest);
+}

blog/2016-11-26-frameworks-without-the-framework.md content/blog/2016-11-26-frameworks-without-the-framework.md

@@ -1,16 +1,17 @@
 const fs = require( 'fs' );
 const path = require( 'path' );
 const hljs = require( 'highlight.js' );
-const { mkdirp } = require( './utils.js' );
+const hasha = require( 'hasha' );
+const { updateManifest, mkdirp } = require( './utils.js' );
 const marked = require( 'marked' );
 
 const root = path.resolve( __dirname, '../..' );
 
-const posts = fs.readdirSync( `${root}/blog` )
+const posts = fs.readdirSync( `${root}/content/blog` )
 	.map( file => {
 		if ( file[0] === '.' || path.extname( file ) !== '.md' ) return;
 
-		const markdown = fs.readFileSync( `${root}/blog/${file}`, 'utf-8' );
+		const markdown = fs.readFileSync( `${root}/content/blog/${file}`, 'utf-8' );
 
 		const match = /---\n([\s\S]+?)\n---/.exec( markdown );
 		const frontMatter = match[1];
@@ -48,9 +49,13 @@ const preview = posts.map( post => {
 	return { slug: post.slug, metadata: post.metadata };
 });
 
-fs.writeFileSync( `${root}/public/blog.json`, JSON.stringify( preview ) );
+const previewJson = JSON.stringify( preview );
+const hash = hasha(previewJson, { algorithm: 'md5' });
+fs.writeFileSync( `${root}/build/blog.${hash}.json`, previewJson );
+updateManifest({ 'blog.json': `blog.${hash}.json` });
 
-mkdirp( `${root}/public/blog` );
+// TODO hash individual posts?
+mkdirp(`${root}/public/blog`);
 posts.forEach( post => {
 	fs.writeFileSync( `${root}/public/blog/${post.slug}.json`, JSON.stringify( post ) );
 });

blog/2017-08-07-the-easiest-way-to-get-started.md content/blog/2017-08-07-the-easiest-way-to-get-started.md

@@ -5,7 +5,7 @@ const { mkdirp } = require( './utils.js' );
 
 const root = path.resolve( __dirname, '../..' );
 
-const manifest = require( `${root}/examples/manifest.json` );
+const manifest = require( `${root}/content/examples/manifest.json` );
 
 mkdirp( `${root}/public/examples` );
 
@@ -15,7 +15,7 @@ manifest.forEach( group => {
 	const groupSummary = [];
 
 	group.examples.forEach( id => {
-		const example = require( `${root}/examples/${id}/example.json` );
+		const example = require( `${root}/content/examples/${id}/example.json` );
 
 		if ( example.redirect ) {
 			redirects[ id ] = example.redirect;
@@ -24,7 +24,7 @@ manifest.forEach( group => {
 
 		example.data = example.data || {};
 
-		example.components = glob.sync( '**/*.+(html|js)', { cwd: `${root}/examples/${id}` })
+		example.components = glob.sync( '**/*.+(html|js)', { cwd: `${root}/content/examples/${id}` })
 			.map( file => {
 				const ext = path.extname(file);
 				const type = ext.slice(1);
@@ -33,7 +33,7 @@ manifest.forEach( group => {
 					name: file.replace( ext, '' ),
 					type,
 					entry: file === 'App.html' ? true : undefined,
-					source: fs.readFileSync( `${root}/examples/${id}/${file}`, 'utf-8' )
+					source: fs.readFileSync( `${root}/content/examples/${id}/${file}`, 'utf-8' )
 				};
 			})
 			.sort( ( a, b ) => {
@@ -61,7 +61,7 @@ manifest.forEach( group => {
 	});
 });
 
-fs.writeFileSync( `${root}/universal/routes/Repl/examples.js`, `
+fs.writeFileSync( `${root}/src/universal/routes/Repl/examples.js`, `
 // this file is auto-generated, don't edit it
 export const exampleGroups = ${JSON.stringify( summary )};
 export const redirects = ${JSON.stringify( redirects )};