1 | ![Build Status](https://travis-ci.org/xpepermint/express-vue-builder.svg?branch=master) [![NPM Version](https://badge.fury.io/js/express-vue-builder.svg)](https://badge.fury.io/js/express-vue-builder) [![Dependency Status](https://gemnasium.com/xpepermint/express-vue-builder.svg)](https://gemnasium.com/xpepermint/express-vue-builder)
|
2 |
|
3 | # [express](http://expressjs.com)-[vue-builder](https://github.com/xpepermint/vue-builder)
|
4 |
|
5 | > Vue.js server-side rendering middleware for Express.js.
|
6 |
|
7 | <img src="logo.png" height="60" style="margin-bottom: 20px" />
|
8 |
|
9 | This package provides production-ready server-side [Vue.js](http://vuejs.org) application rendering middleware for [Express.js](http://expressjs.com). It creates a new instance of [VueRender](https://github.com/xpepermint/vue-builder#api) class (provided by the [vue-builder](https://github.com/xpepermint/express-vue-builder) dependency) and installs it to the request object as `req.vue` variable.
|
10 |
|
11 | This is an open source package for [Vue.js](http://vuejs.org/) and [Express.js](http://expressjs.com). The source code is available on [GitHub](https://github.com/xpepermint/express-vue-builder) where you can also find our [issue tracker](https://github.com/xpepermint/express-vue-builder/issues).
|
12 |
|
13 | ## Related Projects
|
14 |
|
15 | * [vue-webpack](https://github.com/xpepermint/vue-webpack): Webpack configuration object generator for Vue.js.
|
16 | * [vue-builder](https://github.com/xpepermint/vue-builder): Server-side and client-side rendering for Vue.js.
|
17 | * [express-vue-dev](https://github.com/xpepermint/express-vue-dev): Vue.js development server middleware for Express.js.
|
18 | * [vue-cli-template](https://github.com/xpepermint/vue-cli-template): A simple server-side rendering CLI template for Vue.js.
|
19 |
|
20 | ## Install
|
21 |
|
22 | Run the command below to install the package.
|
23 |
|
24 | ```
|
25 | $ npm install --save-dev express-vue-builder vue-builder
|
26 | ```
|
27 |
|
28 | ## Usage
|
29 |
|
30 | Before we deploy application in production, we need to compile our Vue.js application into a bundle. A bundle is simply a file holding application's source code. Because we would like to render application in browsers as well as on the server, we need to build two bundle files - one targeting browsers, the other targeting the server. Check the attached example on how to build a bundle. Check the documentation of the [vue-builder](https://github.com/xpepermint/express-vue-builder) package for details.
|
31 |
|
32 | Once you've created the bundle file for server-side, you can create a middleware.
|
33 |
|
34 | ```js
|
35 | const {bundleRenderer} = require('express-vue-builder');
|
36 |
|
37 | let middleware = bundleRenderer(`./dist/server/bundle.js`); // pass this to app.use() of your Express application
|
38 | ```
|
39 |
|
40 | Check the included `./example` directory or run the `npm run example` command to start the sample application.
|
41 |
|
42 | ## API
|
43 |
|
44 | **bundleRenderer(bundlePath, options)**
|
45 |
|
46 | > Server-side rendering middleware for Vue.js application.
|
47 |
|
48 | | Option | Type | Required | Default | Description
|
49 | |--------|------|----------|---------|------------
|
50 | | bundlePath | String | Yes | - | Path to server-side application bundle.
|
51 | | options | Object | No | - | [Renderer options](https://www.npmjs.com/package/vue-server-renderer#renderer-options).
|
52 |
|
53 | ## License (MIT)
|
54 |
|
55 | ```
|
56 | Copyright (c) 2016 Kristijan Sedlak <xpepermint@gmail.com>
|
57 |
|
58 | Permission is hereby granted, free of charge, to any person obtaining a copy
|
59 | of this software and associated documentation files (the "Software"), to deal
|
60 | in the Software without restriction, including without limitation the rights
|
61 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
62 | copies of the Software, and to permit persons to whom the Software is
|
63 | furnished to do so, subject to the following conditions:
|
64 |
|
65 | The above copyright notice and this permission notice shall be included in
|
66 | all copies or substantial portions of the Software.
|
67 |
|
68 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
69 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
70 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
71 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
72 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
73 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
74 | THE SOFTWARE.
|
75 | ```
|