Build cybernetically enhanced web apps with Meteor and Svelte.
Fork based on meteor-svelte 4 beta with support for HMR using the hot-module-reload package.
Installation
To use meteor-svelte
, run the following commands:
$ meteor add svelte:compiler $ meteor npm install svelte@<version>
Options
Compiler options can be specified with a "svelte:compiler"
property in package.json
. For example:
{ ... "svelte:compiler": { "extensions": ["svelte", "html"], "hydratable": true, "css": false } }
extensions
(default: ["svelte"]
)
An array of file extensions to be recognized by the package.
Note that HTML files are not compiled with the Svelte compiler if they contain top-level <head>
or <body>
elements.
Instead, the contents of the elements are added to the respective sections in the HTML output generated by Meteor (similar to what the static-html
package does).
hydratable
(default: false
)
By default, Svelte removes server-rendered static HTML when the application is loaded on the client and replaces it with a client-rendered version.
If you want to reuse (hydrate) server-rendered HTML, set the hydratable
option to true
(which generates additional code for client components) and use the hydrate
option when instantiating your root component.
css
(default: true
)
Svelte can extract styles for server-side rendering.
If you want to render CSS on the server, you might want to set the css
option to false
so that client-rendered components don't insert CSS into the DOM.
Server-Side Rendering
meteor-svelte
supports server-side rendering with minimal configuration.
If you import Svelte components on the server, they are automatically built for server-side rendering.
See the Svelte API docs, the example app, and the hydratable
and css
options above for more details.