Skip to content
Server-side and client-side rendering for Vue.js.
Branch: master
Clone or download
Latest commit d3b53a2 Jan 14, 2017
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
tests better tests, readme Nov 27, 2016
.gitignore
.travis.yml
README.md
logo.png
nodemon.json
package.json dependencies Jan 14, 2017
yarn.lock dependencies Jan 14, 2017

README.md

Build Status NPM Version Dependency Status

vue-builder

Server-side and client-side rendering for Vue.js.

This package provides tools for rendering Vue.js applications server-side and client-side using the Webpack module bundler.

This is an open source package for Vue.js. The source code is available on GitHub where you can also find our issue tracker.

Related

Packages

Examples

Install

Run the command below to install the package.

$ npm install --save-dev vue vue-server-renderer
$ npm install --save-dev vue-builder

Usage

Create a Webpack configuration object then use the VueBuilder class to build and compile the application.

const config = require('./webpack.config.js'); /* your webpack configuration */
const {VueBuilder} = require('vue-builder');

// create Vue.js builder
const builder = new VueBuilder(config);
// build application to ./dist
let files = await builder.build();
// build application entry to string
let source = await builder.compile();

Use the VueRender class to render the application.

const {VueBuilder} = require('vue-builder');

// create Vue.js renderer
const render = new VueRender(source); // source=builder.render()
// render to stream
let stream = render.renderToStream();
// render to string
let html = await render.renderToString();

API

VueBuilder(config)

Core class for building server-side and client-side bundles.

Option Type Required Default Description
config Object Yes - Webpack configuration object.

VueBuilder.prototype.build():Promise

Returns a promise which saves application files to the destination folder.

VueBuilder.prototype.compile():Promise

Returns a promise which compiles the application bundle and returns the the source code as string.

VueRender(source, options)

Core class for server-side application rendering.

Option Type Required Default Description
source String Yes - Bundle source code.
options Object No - Renderer options.

VueRender.prototype.renderToStream(ctx):Stream

Renders the application and returns a stream.

Option Type Required Default Description
ctx Object No {} Application context object.

VueRender.prototype.renderToString(ctx):Promise

Returns a promise which renders the application and returns a string.

Option Type Required Default Description
ctx Object No {} Application context object.

License (MIT)

Copyright (c) 2016 Kristijan Sedlak <xpepermint@gmail.com>

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
You can’t perform that action at this time.