vue-pronto
Rendering Engine for turning Vue files into Javascript Objects
Installation
$ npm install --save vue-prontoUsage
Include the library at the top level like so
const Pronto = require('vue-pronto');Then init the renderer
const renderer = new Pronto({object});This returns 2 main functions. It takes 3 params, 2 required and one optional.
renderer.RenderToString(componentPath, data, [vueOptions]);
renderer.RenderToStream(componentPath, data, [vueOptions]);Both methods return a promise. Stream returns a stream, and String returns a string.
RenderToStream
renderer.RenderToStream(vuefile, data, vueOptions) ⇒ Promise
renderToStream returns a stream from res.renderVue to the client
Kind: instance method of Renderer
Returns: Promise - - Promise returns a Stream
| Param | Type | Description |
|---|---|---|
| vuefile | string |
full path to .vue component |
| data | Object |
data to be inserted when generating vue class |
| vueOptions | Object |
vue options to be used when generating head |
RenderToString
renderer.RenderToString(vuefile, data, vueOptions) ⇒ Promise
renderToStream returns a string from res.renderVue to the client
Kind: instance method of Renderer
| Param | Type |
|---|---|
| vuefile | string |
| data | object |
| vueOptions | object |
VueOptions
{
pagesPath: path.join(__dirname, '/../tests'),
vueVersion: "2.3.4",
template: {
body: {
start: '<body><div id="app">',
end: '</div></body>'
}
},
webpack: {
/**
* Webpack Server and Client Configs go here
* Takes webpack configs and uses webpack-merge to merge them
* */
client: {},
server: {}
},
vue: {
/**
* This is where you put the string versions of the
* entry.js for server and client
* app is for the app entry.js
* */
app: 'string',
client: 'string',
server: 'string',
},
head: {
metas: [
{
property: 'og:title',
content: 'Page Title'
},
{
name: 'twitter:title',
content: 'Page Title'
},
{
name: 'viewport',
content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'
}
],
scripts: [
{src: 'https://unpkg.com/vue@2.3.4/dist/vue.js'}
],
styles: [
]
}
data: {
thing: true
}License
Apache-2.0 © Daniel Cherubini