From df602b74b066b014456f85b46482f84fb29fdfac Mon Sep 17 00:00:00 2001 From: Jon Ross Date: Tue, 30 Apr 2019 17:30:14 -0700 Subject: [PATCH 1/2] Add barebones description of `svelte/register` I don't know if this is correct, but it works for me and this is better than nothing. --- site/content/docs/03-run-time.md | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/site/content/docs/03-run-time.md b/site/content/docs/03-run-time.md index 5c012ebfa978..76cb1a9bb1d6 100644 --- a/site/content/docs/03-run-time.md +++ b/site/content/docs/03-run-time.md @@ -558,8 +558,17 @@ You can see a full example on the [animations tutorial](tutorial/animate) ### `svelte/register` -TODO +To render Svelte components server-side, use `require('svelte/register')`; after this, you can use `require` to include any `.svelte` file. + +```js +require('svelte/register'); + +const App = require('./App.svelte'); +... + +App.default.render({ title: 'name' }); +``` ### Client-side component API @@ -569,8 +578,6 @@ TODO const component = new Component(options) ``` ---- - A client-side component — that is, a component compiled with `generate: 'dom'` (or the `generate` option left unspecified) is a JavaScript class. ```js From 8f2ccc407ea93912c001d145df233db20dc15d10 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 3 May 2019 23:43:18 -0400 Subject: [PATCH 2/2] flesh out svelte/register docs --- site/content/docs/03-run-time.md | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/site/content/docs/03-run-time.md b/site/content/docs/03-run-time.md index 76cb1a9bb1d6..ed19c3b00927 100644 --- a/site/content/docs/03-run-time.md +++ b/site/content/docs/03-run-time.md @@ -556,20 +556,33 @@ You can see a full example on the [animations tutorial](tutorial/animate) * TODO could have nice little interactive widgets showing the different functions, maybe + ### `svelte/register` -To render Svelte components server-side, use `require('svelte/register')`; after this, you can use `require` to include any `.svelte` file. +To render Svelte components in Node.js without bundling, use `require('svelte/register')`. After that, you can use `require` to include any `.svelte` file. ```js require('svelte/register'); -const App = require('./App.svelte'); +const App = require('./App.svelte').default; ... -App.default.render({ title: 'name' }); +const { html, css, head } = App.render({ answer: 42 }); ``` +> The `.default` is necessary because we're converting from native JavaScript modules to the CommonJS modules recognised by Node. Note that if your component imports JavaScript modules, they will fail to load in Node and you will need to use a bundler instead. + +To set compile options, or to use a custom file extension, call the `register` hook as a function: + +```js +require('svelte/register')({ + extensions: ['.customextension'], // defaults to ['.html', '.svelte'] + preserveComments: true +}); +``` + + ### Client-side component API #### Creating a component