diff --git a/site/content/examples/7guis-circles/data.json5 b/site/content/examples/7guis-circles/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/7guis-circles/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/7guis-counter/App.svelte b/site/content/examples/7guis-counter/App.svelte
index 385a3c9749..11c5993901 100644
--- a/site/content/examples/7guis-counter/App.svelte
+++ b/site/content/examples/7guis-counter/App.svelte
@@ -1,3 +1,7 @@
+<script>
+	let count = 0;
+</script>
+
 <!-- https://github.com/eugenkiss/7guis/wiki#counter -->
 <input type=number bind:value={count}>
 <button on:click="{() => count += 1}">count</button>
\ No newline at end of file
diff --git a/site/content/examples/7guis-counter/data.json5 b/site/content/examples/7guis-counter/data.json5
deleted file mode 100644
index f30dc46c11..0000000000
--- a/site/content/examples/7guis-counter/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "count": 0
-}
\ No newline at end of file
diff --git a/site/content/examples/7guis-crud/App.svelte b/site/content/examples/7guis-crud/App.svelte
index 388a2f4ea3..ed53430eff 100644
--- a/site/content/examples/7guis-crud/App.svelte
+++ b/site/content/examples/7guis-crud/App.svelte
@@ -1,7 +1,20 @@
 <!-- https://eugenkiss.github.io/7guis/tasks#crud -->
 
 <script>
-	export let people = [];
+	let people = [
+		{
+			first: 'Hans',
+			last: 'Emil'
+		},
+		{
+			first: 'Max',
+			last: 'Mustermann'
+		},
+		{
+			first: 'Roman',
+			last: 'Tisch'
+		}
+	];
 
 	let prefix = '';
 	let first = '';
diff --git a/site/content/examples/7guis-crud/data.json5 b/site/content/examples/7guis-crud/data.json5
deleted file mode 100644
index c3e6dc3e67..0000000000
--- a/site/content/examples/7guis-crud/data.json5
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "people": [
-    {
-      "first": "Hans",
-      "last": "Emil"
-    },
-    {
-      "first": "Max",
-      "last": "Mustermann"
-    },
-    {
-      "first": "Roman",
-      "last": "Tisch"
-    }
-  ]
-}
\ No newline at end of file
diff --git a/site/content/examples/7guis-flight-booker/data.json5 b/site/content/examples/7guis-flight-booker/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/7guis-flight-booker/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/7guis-temperature/data.json5 b/site/content/examples/7guis-temperature/data.json5
deleted file mode 100644
index 21950c8dfb..0000000000
--- a/site/content/examples/7guis-temperature/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "celsius": 0
-}
\ No newline at end of file
diff --git a/site/content/examples/7guis-timer/data.json5 b/site/content/examples/7guis-timer/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/7guis-timer/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/await-block/data.json5 b/site/content/examples/await-block/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/await-block/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/bar-chart/App.svelte b/site/content/examples/bar-chart/App.svelte
index a4b01f97dd..b6be4d6b44 100644
--- a/site/content/examples/bar-chart/App.svelte
+++ b/site/content/examples/bar-chart/App.svelte
@@ -1,7 +1,14 @@
 <script>
 	import { scaleLinear } from 'd3-scale';
 
-	export let points;
+	const points = [
+		{ year: 1990, birthrate: 16.7 },
+		{ year: 1995, birthrate: 14.6 },
+		{ year: 2000, birthrate: 14.4 },
+		{ year: 2005, birthrate: 14 },
+		{ year: 2010, birthrate: 13 },
+		{ year: 2015, birthrate: 12.4 }
+	];
 
 	const xTicks = [1990, 1995, 2000, 2005, 2010, 2015];
 	const yTicks = [0, 5, 10, 15, 20];
diff --git a/site/content/examples/bar-chart/data.json5 b/site/content/examples/bar-chart/data.json5
deleted file mode 100644
index 389c90a7d1..0000000000
--- a/site/content/examples/bar-chart/data.json5
+++ /dev/null
@@ -1,28 +0,0 @@
-{
-  "points": [
-    {
-      "year": 1990,
-      "birthrate": 16.7
-    },
-    {
-      "year": 1995,
-      "birthrate": 14.6
-    },
-    {
-      "year": 2000,
-      "birthrate": 14.4
-    },
-    {
-      "year": 2005,
-      "birthrate": 14
-    },
-    {
-      "year": 2010,
-      "birthrate": 13
-    },
-    {
-      "year": 2015,
-      "birthrate": 12.4
-    }
-  ]
-}
\ No newline at end of file
diff --git a/site/content/examples/binding-input-checkbox-group/App.svelte b/site/content/examples/binding-input-checkbox-group/App.svelte
index 617e71e17d..9831a61591 100644
--- a/site/content/examples/binding-input-checkbox-group/App.svelte
+++ b/site/content/examples/binding-input-checkbox-group/App.svelte
@@ -1,3 +1,7 @@
+<script>
+	const selected = ['blue'];
+</script>
+
 <label>
 	<input type=checkbox bind:group={selected} value="red">
 	red
diff --git a/site/content/examples/binding-input-checkbox-group/data.json5 b/site/content/examples/binding-input-checkbox-group/data.json5
deleted file mode 100644
index 2285e3abfa..0000000000
--- a/site/content/examples/binding-input-checkbox-group/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "selected": ["blue"]
-}
\ No newline at end of file
diff --git a/site/content/examples/binding-input-checkbox/App.svelte b/site/content/examples/binding-input-checkbox/App.svelte
index b8facdd53b..901054fbc0 100644
--- a/site/content/examples/binding-input-checkbox/App.svelte
+++ b/site/content/examples/binding-input-checkbox/App.svelte
@@ -1,9 +1,19 @@
-{#each todos as todo}
-	<div class="todo {todo.done ? 'done': ''}">
-		<input type=checkbox bind:checked={todo.done}>
-		<input type=text bind:value={todo.description}>
-	</div>
-{/each}
+<script>
+	const todos = [
+		{
+			description: "Buy some milk",
+			done: true
+		},
+		{
+			description: "Do the laundry",
+			done: true
+		},
+		{
+			description: "Find life's true purpose",
+			done: false
+		}
+	];
+</script>
 
 <style>
 	input[type="text"] {
@@ -14,4 +24,11 @@
 	.done {
 		opacity: 0.6;
 	}
-</style>
\ No newline at end of file
+</style>
+
+{#each todos as todo}
+	<div class="todo {todo.done ? 'done': ''}">
+		<input type=checkbox bind:checked={todo.done}>
+		<input type=text bind:value={todo.description}>
+	</div>
+{/each}
\ No newline at end of file
diff --git a/site/content/examples/binding-input-checkbox/data.json5 b/site/content/examples/binding-input-checkbox/data.json5
deleted file mode 100644
index 4afee559a5..0000000000
--- a/site/content/examples/binding-input-checkbox/data.json5
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "todos": [
-    {
-      "description": "Buy some milk",
-      "done": true
-    },
-    {
-      "description": "Do the laundry",
-      "done": true
-    },
-    {
-      "description": "Find life's true purpose",
-      "done": false
-    }
-  ]
-}
\ No newline at end of file
diff --git a/site/content/examples/binding-input-numeric/App.svelte b/site/content/examples/binding-input-numeric/App.svelte
index 566c16006c..97cda96bcb 100644
--- a/site/content/examples/binding-input-numeric/App.svelte
+++ b/site/content/examples/binding-input-numeric/App.svelte
@@ -1,12 +1,17 @@
-<!-- number and range inputs are bound to numeric values -->
-<input bind:value={a} type=number min=0 max=10>
-<input bind:value={b} type=range min=0 max=10>
-
-<p>{a} * {b} = {a * b}</p>
+<script>
+	let a = 5;
+	let b = 5;
+</script>
 
 <style>
 	input {
 		display: block;
 		width: 10em
 	}
-</style>
\ No newline at end of file
+</style>
+
+<!-- number and range inputs are bound to numeric values -->
+<input bind:value={a} type=number min=0 max=10>
+<input bind:value={b} type=range min=0 max=10>
+
+<p>{a} * {b} = {a * b}</p>
\ No newline at end of file
diff --git a/site/content/examples/binding-input-numeric/data.json5 b/site/content/examples/binding-input-numeric/data.json5
deleted file mode 100644
index 1aa99a76cd..0000000000
--- a/site/content/examples/binding-input-numeric/data.json5
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-  "a": 5,
-  "b": 5
-}
\ No newline at end of file
diff --git a/site/content/examples/binding-input-radio/App.svelte b/site/content/examples/binding-input-radio/App.svelte
index f83813754f..abeafedfd6 100644
--- a/site/content/examples/binding-input-radio/App.svelte
+++ b/site/content/examples/binding-input-radio/App.svelte
@@ -1,3 +1,7 @@
+<script>
+	let selected = 'blue';
+</script>
+
 <label>
 	<input type=radio bind:group={selected} value="red">
 	red
diff --git a/site/content/examples/binding-input-radio/data.json5 b/site/content/examples/binding-input-radio/data.json5
deleted file mode 100644
index 961184190e..0000000000
--- a/site/content/examples/binding-input-radio/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "selected": "blue"
-}
\ No newline at end of file
diff --git a/site/content/examples/binding-input-text/App.svelte b/site/content/examples/binding-input-text/App.svelte
index 5d81d1e564..5eab79764a 100644
--- a/site/content/examples/binding-input-text/App.svelte
+++ b/site/content/examples/binding-input-text/App.svelte
@@ -1,2 +1,6 @@
+<script>
+	let name = '';
+</script>
+
 <input bind:value={name} placeholder="enter your name">
 <p>Hello {name || 'stranger'}!</p>
\ No newline at end of file
diff --git a/site/content/examples/binding-input-text/data.json5 b/site/content/examples/binding-input-text/data.json5
deleted file mode 100644
index 393554903d..0000000000
--- a/site/content/examples/binding-input-text/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "name": ""
-}
\ No newline at end of file
diff --git a/site/content/examples/binding-media-elements/data.json5 b/site/content/examples/binding-media-elements/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/binding-media-elements/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/binding-textarea/App.svelte b/site/content/examples/binding-textarea/App.svelte
index 4fd46f2625..2c097a0b55 100644
--- a/site/content/examples/binding-textarea/App.svelte
+++ b/site/content/examples/binding-textarea/App.svelte
@@ -1,15 +1,15 @@
 <script>
 	import marked from 'marked';
 
-	export let markdown;
+	let markdown = `# Markdown editor\n\nTODOs:\n\n* make a Svelte app\n* think of a third item for this list`;
 </script>
 
-<textarea bind:value={markdown} resize="none"></textarea>
-<div class="output">{@html marked(markdown)}</div>
-
 <style>
 	textarea {
 		width: 100%;
 		height: 50%;
 	}
-</style>
\ No newline at end of file
+</style>
+
+<textarea bind:value={markdown} resize="none"></textarea>
+<div class="output">{@html marked(markdown)}</div>
\ No newline at end of file
diff --git a/site/content/examples/binding-textarea/data.json5 b/site/content/examples/binding-textarea/data.json5
deleted file mode 100644
index 12268060fb..0000000000
--- a/site/content/examples/binding-textarea/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "markdown": "# Markdown editor\n\nTODOs:\n\n* make a Svelte app\n* think of a third item for this list"
-}
\ No newline at end of file
diff --git a/site/content/examples/each-blocks/App.svelte b/site/content/examples/each-blocks/App.svelte
index b8ba07a5e9..bf91fec8d4 100644
--- a/site/content/examples/each-blocks/App.svelte
+++ b/site/content/examples/each-blocks/App.svelte
@@ -1,3 +1,20 @@
+<script>
+	const cats = [
+		{
+			name: 'Keyboard Cat',
+			video: 'https://www.youtube.com/watch?v=J---aiyznGQ'
+		},
+		{
+			name: 'Maru',
+			video: 'https://www.youtube.com/watch?v=z_AbfPXTKms'
+		},
+		{
+			name: 'Henri The Existential Cat',
+			video: 'https://www.youtube.com/watch?v=OUtn3pvWmpg'
+		}
+	];
+</script>
+
 <h1>Cats of YouTube</h1>
 
 <ul>
diff --git a/site/content/examples/each-blocks/data.json5 b/site/content/examples/each-blocks/data.json5
deleted file mode 100644
index 41eff03354..0000000000
--- a/site/content/examples/each-blocks/data.json5
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "cats": [
-    {
-      "name": "Keyboard Cat",
-      "video": "https://www.youtube.com/watch?v=J---aiyznGQ"
-    },
-    {
-      "name": "Maru",
-      "video": "https://www.youtube.com/watch?v=z_AbfPXTKms"
-    },
-    {
-      "name": "Henri The Existential Cat",
-      "video": "https://www.youtube.com/watch?v=OUtn3pvWmpg"
-    }
-  ]
-}
\ No newline at end of file
diff --git a/site/content/examples/hacker-news/data.json5 b/site/content/examples/hacker-news/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/hacker-news/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/hello-world/App.svelte b/site/content/examples/hello-world/App.svelte
index 70a9a95503..22b3c84db0 100644
--- a/site/content/examples/hello-world/App.svelte
+++ b/site/content/examples/hello-world/App.svelte
@@ -1,14 +1,5 @@
-<h1>Hello {name}!</h1>
+<script>
+	let name = 'world';
+</script>
 
-<!--
-This is a Svelte component. Click 'JS output' in
-the output section to see compiled code.
-
-You can interact with this component via your
-browser's console - try running the following:
-
-    app.name = 'everybody';
-
-You can also update the name via the props
-editor on this page.
--->
\ No newline at end of file
+<h1>Hello {name}!</h1>
\ No newline at end of file
diff --git a/site/content/examples/hello-world/data.json5 b/site/content/examples/hello-world/data.json5
deleted file mode 100644
index 3949aecc6a..0000000000
--- a/site/content/examples/hello-world/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "name": "world"
-}
\ No newline at end of file
diff --git a/site/content/examples/homepage-demo-hello-world/App.svelte b/site/content/examples/homepage-demo-hello-world/App.svelte
index 543c6059c4..22b3c84db0 100644
--- a/site/content/examples/homepage-demo-hello-world/App.svelte
+++ b/site/content/examples/homepage-demo-hello-world/App.svelte
@@ -1 +1,5 @@
+<script>
+	let name = 'world';
+</script>
+
 <h1>Hello {name}!</h1>
\ No newline at end of file
diff --git a/site/content/examples/homepage-demo-hello-world/data.json5 b/site/content/examples/homepage-demo-hello-world/data.json5
deleted file mode 100644
index 3949aecc6a..0000000000
--- a/site/content/examples/homepage-demo-hello-world/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "name": "world"
-}
\ No newline at end of file
diff --git a/site/content/examples/homepage-demo-reactivity/data.json5 b/site/content/examples/homepage-demo-reactivity/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/homepage-demo-reactivity/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/homepage-demo-scoped-styles/data.json5 b/site/content/examples/homepage-demo-scoped-styles/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/homepage-demo-scoped-styles/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/homepage-demo-transitions/data.json5 b/site/content/examples/homepage-demo-transitions/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/homepage-demo-transitions/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/if-blocks/App.svelte b/site/content/examples/if-blocks/App.svelte
index 57de219159..a30128211c 100644
--- a/site/content/examples/if-blocks/App.svelte
+++ b/site/content/examples/if-blocks/App.svelte
@@ -1,3 +1,7 @@
+<script>
+	let foo = true;
+</script>
+
 {#if foo}
 	<p>foo!</p>
 {:else}
diff --git a/site/content/examples/if-blocks/data.json5 b/site/content/examples/if-blocks/data.json5
deleted file mode 100644
index c803db4749..0000000000
--- a/site/content/examples/if-blocks/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "foo": true
-}
\ No newline at end of file
diff --git a/site/content/examples/immutable/App.svelte b/site/content/examples/immutable/App.svelte
index 8cfc14aacb..b4ae34285f 100644
--- a/site/content/examples/immutable/App.svelte
+++ b/site/content/examples/immutable/App.svelte
@@ -4,7 +4,11 @@
 	import ImmutableTodo from './ImmutableTodo.svelte';
 	import MutableTodo from './MutableTodo.svelte';
 
-	export let todos;
+	let todos = [
+		{ id: 1, done: true, text: 'wash the car' },
+		{ id: 2, done: false, text: 'take the dog for a walk' },
+		{ id: 3, done: false, text: 'mow the lawn' }
+	];
 
 	function toggle(id) {
 		todos = todos.map(todo => {
diff --git a/site/content/examples/immutable/data.json5 b/site/content/examples/immutable/data.json5
deleted file mode 100644
index a0ed59d82b..0000000000
--- a/site/content/examples/immutable/data.json5
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-	todos: [
-		{ id: 1, done: true, text: "wash the car" },
-		{ id: 2, done: false, text: "take the dog for a walk" },
-		{ id: 3, done: false, text: "mow the lawn" }
-	]
-}
diff --git a/site/content/examples/line-chart/App.svelte b/site/content/examples/line-chart/App.svelte
index 497213ee0a..c41801e036 100644
--- a/site/content/examples/line-chart/App.svelte
+++ b/site/content/examples/line-chart/App.svelte
@@ -1,8 +1,7 @@
 <script>
 	import { onMount } from 'svelte';
 	import { scaleLinear } from 'd3-scale';
-
-	export let points;
+	import points from './data.js';
 
 	const yTicks = [0, 2, 4, 6, 8];
 	const xTicks = [1980, 1990, 2000, 2010];
diff --git a/site/content/examples/line-chart/data.js b/site/content/examples/line-chart/data.js
new file mode 100644
index 0000000000..72cb04f0d8
--- /dev/null
+++ b/site/content/examples/line-chart/data.js
@@ -0,0 +1,40 @@
+export default [
+	{ x: 1979, y: 7.19 },
+	{ x: 1980, y: 7.83 },
+	{ x: 1981, y: 7.24 },
+	{ x: 1982, y: 7.44 },
+	{ x: 1983, y: 7.51 },
+	{ x: 1984, y: 7.10 },
+	{ x: 1985, y: 6.91 },
+	{ x: 1986, y: 7.53 },
+	{ x: 1987, y: 7.47 },
+	{ x: 1988, y: 7.48 },
+	{ x: 1989, y: 7.03 },
+	{ x: 1990, y: 6.23 },
+	{ x: 1991, y: 6.54 },
+	{ x: 1992, y: 7.54 },
+	{ x: 1993, y: 6.50 },
+	{ x: 1994, y: 7.18 },
+	{ x: 1995, y: 6.12 },
+	{ x: 1996, y: 7.87 },
+	{ x: 1997, y: 6.73 },
+	{ x: 1998, y: 6.55 },
+	{ x: 1999, y: 6.23 },
+	{ x: 2000, y: 6.31 },
+	{ x: 2001, y: 6.74 },
+	{ x: 2002, y: 5.95 },
+	{ x: 2003, y: 6.13 },
+	{ x: 2004, y: 6.04 },
+	{ x: 2005, y: 5.56 },
+	{ x: 2006, y: 5.91 },
+	{ x: 2007, y: 4.29 },
+	{ x: 2008, y: 4.72 },
+	{ x: 2009, y: 5.38 },
+	{ x: 2010, y: 4.92 },
+	{ x: 2011, y: 4.61 },
+	{ x: 2012, y: 3.62 },
+	{ x: 2013, y: 5.35 },
+	{ x: 2014, y: 5.28 },
+	{ x: 2015, y: 4.63 },
+	{ x: 2016, y: 4.72 }
+];
\ No newline at end of file
diff --git a/site/content/examples/line-chart/data.json5 b/site/content/examples/line-chart/data.json5
deleted file mode 100644
index 88e7f02f35..0000000000
--- a/site/content/examples/line-chart/data.json5
+++ /dev/null
@@ -1,156 +0,0 @@
-{
-  "points": [
-    {
-      "x": 1979,
-      "y": 7.19
-    },
-    {
-      "x": 1980,
-      "y": 7.83
-    },
-    {
-      "x": 1981,
-      "y": 7.24
-    },
-    {
-      "x": 1982,
-      "y": 7.44
-    },
-    {
-      "x": 1983,
-      "y": 7.51
-    },
-    {
-      "x": 1984,
-      "y": 7.1
-    },
-    {
-      "x": 1985,
-      "y": 6.91
-    },
-    {
-      "x": 1986,
-      "y": 7.53
-    },
-    {
-      "x": 1987,
-      "y": 7.47
-    },
-    {
-      "x": 1988,
-      "y": 7.48
-    },
-    {
-      "x": 1989,
-      "y": 7.03
-    },
-    {
-      "x": 1990,
-      "y": 6.23
-    },
-    {
-      "x": 1991,
-      "y": 6.54
-    },
-    {
-      "x": 1992,
-      "y": 7.54
-    },
-    {
-      "x": 1993,
-      "y": 6.5
-    },
-    {
-      "x": 1994,
-      "y": 7.18
-    },
-    {
-      "x": 1995,
-      "y": 6.12
-    },
-    {
-      "x": 1996,
-      "y": 7.87
-    },
-    {
-      "x": 1997,
-      "y": 6.73
-    },
-    {
-      "x": 1998,
-      "y": 6.55
-    },
-    {
-      "x": 1999,
-      "y": 6.23
-    },
-    {
-      "x": 2000,
-      "y": 6.31
-    },
-    {
-      "x": 2001,
-      "y": 6.74
-    },
-    {
-      "x": 2002,
-      "y": 5.95
-    },
-    {
-      "x": 2003,
-      "y": 6.13
-    },
-    {
-      "x": 2004,
-      "y": 6.04
-    },
-    {
-      "x": 2005,
-      "y": 5.56
-    },
-    {
-      "x": 2006,
-      "y": 5.91
-    },
-    {
-      "x": 2007,
-      "y": 4.29
-    },
-    {
-      "x": 2008,
-      "y": 4.72
-    },
-    {
-      "x": 2009,
-      "y": 5.38
-    },
-    {
-      "x": 2010,
-      "y": 4.92
-    },
-    {
-      "x": 2011,
-      "y": 4.61
-    },
-    {
-      "x": 2012,
-      "y": 3.62
-    },
-    {
-      "x": 2013,
-      "y": 5.35
-    },
-    {
-      "x": 2014,
-      "y": 5.28
-    },
-    {
-      "x": 2015,
-      "y": 4.63
-    },
-    {
-      "x": 2016,
-      "y": 4.72
-    }
-  ]
-}
\ No newline at end of file
diff --git a/site/content/examples/modal-with-slot/App.svelte b/site/content/examples/modal-with-slot/App.svelte
index 665a89554e..ac9d441f52 100644
--- a/site/content/examples/modal-with-slot/App.svelte
+++ b/site/content/examples/modal-with-slot/App.svelte
@@ -1,7 +1,7 @@
 <script>
 	import Modal from './Modal.svelte';
 
-	export let showModal;
+	let showModal = true;
 </script>
 
 {#if showModal}
diff --git a/site/content/examples/modal-with-slot/data.json5 b/site/content/examples/modal-with-slot/data.json5
deleted file mode 100644
index 18cc32884c..0000000000
--- a/site/content/examples/modal-with-slot/data.json5
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "showModal": true
-}
\ No newline at end of file
diff --git a/site/content/examples/nested-components/data.json5 b/site/content/examples/nested-components/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/nested-components/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/parallax/data.json5 b/site/content/examples/parallax/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/parallax/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/scatterplot/App.svelte b/site/content/examples/scatterplot/App.svelte
index 8e88532ab5..42a0660b87 100644
--- a/site/content/examples/scatterplot/App.svelte
+++ b/site/content/examples/scatterplot/App.svelte
@@ -1,21 +1,8 @@
 <script>
 	import Scatterplot from './Scatterplot.svelte';
-
-	export let a;
-	export let b;
-	export let c;
-	export let d;
+	import data from './data.js';
 </script>
 
-<div class="chart">
-	<h2>Anscombe's quartet</h2>
-
-	<Scatterplot points={a}/>
-	<Scatterplot points={b}/>
-	<Scatterplot points={c}/>
-	<Scatterplot points={d}/>
-</div>
-
 <style>
 	.chart {
 		width: 100%;
@@ -25,4 +12,13 @@
 		max-height: 480px;
 		margin: 0 auto;
 	}
-</style>
\ No newline at end of file
+</style>
+
+<div class="chart">
+	<h2>Anscombe's quartet</h2>
+
+	<Scatterplot points={data.a}/>
+	<Scatterplot points={data.b}/>
+	<Scatterplot points={data.c}/>
+	<Scatterplot points={data.d}/>
+</div>
\ No newline at end of file
diff --git a/site/content/examples/scatterplot/data.js b/site/content/examples/scatterplot/data.js
new file mode 100644
index 0000000000..0faeb976d9
--- /dev/null
+++ b/site/content/examples/scatterplot/data.js
@@ -0,0 +1,54 @@
+export default {
+	a: [
+		{ x: 10, y: 8.04 },
+		{ x: 8, y: 6.95 },
+		{ x: 13, y: 7.58 },
+		{ x: 9, y: 8.81 },
+		{ x: 11, y: 8.33 },
+		{ x: 14, y: 9.96 },
+		{ x: 6, y: 7.24 },
+		{ x: 4, y: 4.26 },
+		{ x: 12, y: 10.84 },
+		{ x: 7, y: 4.82 },
+		{ x: 5, y: 5.68 }
+	],
+	b: [
+		{ x: 10, y: 9.14 },
+		{ x: 8, y: 8.14 },
+		{ x: 13, y: 8.74 },
+		{ x: 9, y: 8.77 },
+		{ x: 11, y: 9.26 },
+		{ x: 14, y: 8.1 },
+		{ x: 6, y: 6.13 },
+		{ x: 4, y: 3.1 },
+		{ x: 12, y: 9.13 },
+		{ x: 7, y: 7.26 },
+		{ x: 5, y: 4.74 }
+	],
+	c: [
+		{ x: 10, y: 7.46 },
+		{ x: 8, y: 6.77 },
+		{ x: 13, y: 12.74 },
+		{ x: 9, y: 7.11 },
+		{ x: 11, y: 7.81 },
+		{ x: 14, y: 8.84 },
+		{ x: 6, y: 6.08 },
+		{ x: 4, y: 5.39 },
+		{ x: 12, y: 8.15 },
+		{ x: 7, y: 6.42 },
+		{ x: 5, y: 5.73 }
+	],
+	d: [
+		{ x: 8, y: 6.58 },
+		{ x: 8, y: 5.76 },
+		{ x: 8, y: 7.71 },
+		{ x: 8, y: 8.84 },
+		{ x: 8, y: 8.47 },
+		{ x: 8, y: 7.04 },
+		{ x: 8, y: 5.25 },
+		{ x: 19, y: 12.5 },
+		{ x: 8, y: 5.56 },
+		{ x: 8, y: 7.91 },
+		{ x: 8, y: 6.89 }
+	]
+};
\ No newline at end of file
diff --git a/site/content/examples/scatterplot/data.json5 b/site/content/examples/scatterplot/data.json5
deleted file mode 100644
index 8d879e1edd..0000000000
--- a/site/content/examples/scatterplot/data.json5
+++ /dev/null
@@ -1,186 +0,0 @@
-{
-  "a": [
-    {
-      "x": 10,
-      "y": 8.04
-    },
-    {
-      "x": 8,
-      "y": 6.95
-    },
-    {
-      "x": 13,
-      "y": 7.58
-    },
-    {
-      "x": 9,
-      "y": 8.81
-    },
-    {
-      "x": 11,
-      "y": 8.33
-    },
-    {
-      "x": 14,
-      "y": 9.96
-    },
-    {
-      "x": 6,
-      "y": 7.24
-    },
-    {
-      "x": 4,
-      "y": 4.26
-    },
-    {
-      "x": 12,
-      "y": 10.84
-    },
-    {
-      "x": 7,
-      "y": 4.82
-    },
-    {
-      "x": 5,
-      "y": 5.68
-    }
-  ],
-  "b": [
-    {
-      "x": 10,
-      "y": 9.14
-    },
-    {
-      "x": 8,
-      "y": 8.14
-    },
-    {
-      "x": 13,
-      "y": 8.74
-    },
-    {
-      "x": 9,
-      "y": 8.77
-    },
-    {
-      "x": 11,
-      "y": 9.26
-    },
-    {
-      "x": 14,
-      "y": 8.1
-    },
-    {
-      "x": 6,
-      "y": 6.13
-    },
-    {
-      "x": 4,
-      "y": 3.1
-    },
-    {
-      "x": 12,
-      "y": 9.13
-    },
-    {
-      "x": 7,
-      "y": 7.26
-    },
-    {
-      "x": 5,
-      "y": 4.74
-    }
-  ],
-  "c": [
-    {
-      "x": 10,
-      "y": 7.46
-    },
-    {
-      "x": 8,
-      "y": 6.77
-    },
-    {
-      "x": 13,
-      "y": 12.74
-    },
-    {
-      "x": 9,
-      "y": 7.11
-    },
-    {
-      "x": 11,
-      "y": 7.81
-    },
-    {
-      "x": 14,
-      "y": 8.84
-    },
-    {
-      "x": 6,
-      "y": 6.08
-    },
-    {
-      "x": 4,
-      "y": 5.39
-    },
-    {
-      "x": 12,
-      "y": 8.15
-    },
-    {
-      "x": 7,
-      "y": 6.42
-    },
-    {
-      "x": 5,
-      "y": 5.73
-    }
-  ],
-  "d": [
-    {
-      "x": 8,
-      "y": 6.58
-    },
-    {
-      "x": 8,
-      "y": 5.76
-    },
-    {
-      "x": 8,
-      "y": 7.71
-    },
-    {
-      "x": 8,
-      "y": 8.84
-    },
-    {
-      "x": 8,
-      "y": 8.47
-    },
-    {
-      "x": 8,
-      "y": 7.04
-    },
-    {
-      "x": 8,
-      "y": 5.25
-    },
-    {
-      "x": 19,
-      "y": 12.5
-    },
-    {
-      "x": 8,
-      "y": 5.56
-    },
-    {
-      "x": 8,
-      "y": 7.91
-    },
-    {
-      "x": 8,
-      "y": 6.89
-    }
-  ]
-}
\ No newline at end of file
diff --git a/site/content/examples/scoped-styles/data.json5 b/site/content/examples/scoped-styles/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/scoped-styles/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/self-references/App.svelte b/site/content/examples/self-references/App.svelte
index bd4475e206..2a579ace2d 100644
--- a/site/content/examples/self-references/App.svelte
+++ b/site/content/examples/self-references/App.svelte
@@ -1,3 +1,36 @@
+<script>
+	const node = {
+		name: 'Fruit',
+		children: [
+			{
+				name: 'Red',
+				children: [
+					{
+						name: 'Cherry'
+					},
+					{
+						name: 'Strawberry'
+					}
+				]
+			},
+			{
+				name: 'Green',
+				children: [
+					{
+						name: 'Apple'
+					},
+					{
+						name: 'Pear'
+					},
+					{
+						name: 'Lime'
+					}
+				]
+			}
+		]
+	};
+</script>
+
 <ul>
 	<li>{node.name}
 		{#if node.children}
diff --git a/site/content/examples/self-references/data.json5 b/site/content/examples/self-references/data.json5
deleted file mode 100644
index de0cfbd194..0000000000
--- a/site/content/examples/self-references/data.json5
+++ /dev/null
@@ -1,32 +0,0 @@
-{
-  "node": {
-    "name": "Fruit",
-    "children": [
-      {
-        "name": "Red",
-        "children": [
-          {
-            "name": "Cherry"
-          },
-          {
-            "name": "Strawberry"
-          }
-        ]
-      },
-      {
-        "name": "Green",
-        "children": [
-          {
-            "name": "Apple"
-          },
-          {
-            "name": "Pear"
-          },
-          {
-            "name": "Lime"
-          }
-        ]
-      }
-    ]
-  }
-}
\ No newline at end of file
diff --git a/site/content/examples/svg-clock/data.json5 b/site/content/examples/svg-clock/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/svg-clock/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/transitions-custom/data.json5 b/site/content/examples/transitions-custom/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/transitions-custom/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/transitions-fade/data.json5 b/site/content/examples/transitions-fade/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/transitions-fade/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/transitions-fly/data.json5 b/site/content/examples/transitions-fly/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/transitions-fly/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/content/examples/transitions-in-out/data.json5 b/site/content/examples/transitions-in-out/data.json5
deleted file mode 100644
index 9e26dfeeb6..0000000000
--- a/site/content/examples/transitions-in-out/data.json5
+++ /dev/null
@@ -1 +0,0 @@
-{}
\ No newline at end of file
diff --git a/site/scripts/get-examples-from-tutorials/index.js b/site/scripts/get-examples-from-tutorials/index.js
new file mode 100644
index 0000000000..e69de29bb2