Make hydratable (#65).

plentico · Sep 21, 2020 · 6057b14 · 6057b14
1 parent 8a19a8e
commit 6057b14
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 17 deletions.
diff --git a/cmd/build/client.go b/cmd/build/client.go
@@ -115,7 +115,7 @@ func compileSvelte(ctx *v8go.Context, SSRctx *v8go.Context, layoutPath string, d
 	componentStr := string(component)
 
 	// Compile component with Svelte.
-	ctx.RunScript("var { js, css } = svelte.compile(`"+componentStr+"`, {css: false});", "compile_svelte")
+	ctx.RunScript("var { js, css } = svelte.compile(`"+componentStr+"`, {css: false, hydratable: true});", "compile_svelte")
 
 	// Get the JS code from the compiled result.
 	jsCode, err := ctx.RunScript("js.code;", "compile_svelte")

diff --git a/ejected/main.js b/ejected/main.js
@@ -1,10 +1,6 @@
 import Router from './router.svelte';
 
-const replaceContainer = Component => {
-  const frag = document.createDocumentFragment();
-  const dom = document.querySelector('#hydrate-plenti');
-  const component = new Component( Object.assign( {}, { target: dom }, { target: frag } ));
-  dom.replaceWith(frag);
-}
-
-replaceContainer(Router);
+new Router({
+  target: document.querySelector('#hydrate-plenti'),
+  hydrate: true
+});
diff --git a/generated/ejected.go b/generated/ejected.go
@@ -110,14 +110,10 @@ staticBuildStr.forEach(arg => {
 });`),
 	"/main.js": []byte(`import Router from './router.svelte';
 
-const replaceContainer = Component => {
-  const frag = document.createDocumentFragment();
-  const dom = document.querySelector('#hydrate-plenti');
-  const component = new Component( Object.assign( {}, { target: dom }, { target: frag } ));
-  dom.replaceWith(frag);
-}
-
-replaceContainer(Router);`),
+new Router({
+  target: document.querySelector('#hydrate-plenti'),
+  hydrate: true
+});`),
 	"/router.svelte": []byte(`<Html {route} {content} {allContent} />
 
 <script>