- Notifications
You must be signed in to change notification settings - Fork0
dozjs/doz-ssr
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
DOZ server-side rendering
npm install doz-ssrconstKoa=require('koa');constserve=require('koa-static');constbody=require('koa-body');constDozSSR=require('doz-ssr');constdozSSR=newDozSSR('./dist/index.html');newKoa().use(serve('./public',{index:false})).use(body()).use(asyncctx=>{const[content]=awaitdozSSR.render(ctx.url,{baseUrl:ctx.protocol+'://'+ctx.host});ctx.body=content;}).listen(3000);
IMPORTANT, since 2.0.0 it's necessary to callwindow.SSR.ready() inside your Doz app
newDoz({root:'#app',template(h){returnh` <div></div> `},onMount(){if(window.SSR)window.SSR.ready();}});
<!DOCTYPE html><htmllang="en"><head><title>MyApp</title></head><body><divid="app"></div><scriptid="bundle"src="/bundle.js"></script></body></html>
Kind: global class
- DozSSR
- new DozSSR(entryFile, [opt])
- .getBundlePath() ⇒
string - .render(routePath, [opts]) ⇒
Promise.<*>
| Param | Type | Default | Description |
|---|---|---|---|
| entryFile | string | File index. | |
| [opt] | object | Options. | |
| [opt.bundleId] | string | "bundle" | Bundle id selector. |
| [opt.appRootId] | string | "app" | App id selector. |
| [opt.docTypeString] | string | "<!DOCTYPE html>" | Document type. |
Get bundle path from src attribute
Kind: instance method ofDozSSR
Render app
Kind: instance method ofDozSSR
| Param | Type | Default | Description |
|---|---|---|---|
| routePath | string | The route path. | |
| [opts] | object | Rendering options | |
| [opts.reloadBundle] | boolean | false | If true, the bundle will be reload every render call. This operation is slow so useful only in develop mode. |
| [opts.baseUrl] | string | "http://localhost" | The base url. Really this param is very important, you must fill it with your real domain in production environment. |
| [opts.inject] | string | This options is useful to inject code before app bundle execution. | |
| [opts.headers] | object | Accepts the headers of the request`, | |
| [opts.cleanerScript] | boolean | false | Cleaner script before to the client rendering`, |
| [opts.replacements] | object | This options is useful to replace any placeholder like this |
There is a plugin that adds a method and a directive:
importssrPluginfrom'doz-ssr/plugin'Doz.use(ssrPlugin);// If you call isSSR() method inside your app you can check if it is in server environmentDoz.component('my-component',function(h){returnh` <div>is server?${this.isSSR()}</div> `})// If you want exclude (not visible) a component or part of html you can use the directive `d-ssr-invisible`Doz.component('my-component',function(h){returnh` <div> hello my friend <!-- on server side this will be not shown --> <div d-ssr-invisible>wow!</div> </div> `})
You can view the changeloghere
doz-ssr is open-sourced software licensed under theMIT license