Skip to content

Commit 2f79a56

Browse files
committed
update for 2.5
1 parent bf2b477 commit 2f79a56

File tree

5 files changed

+71
-8
lines changed

5 files changed

+71
-8
lines changed

en/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ If you're using webpack, you can easily add prerendering with the [prerender-spa
4141

4242
## About This Guide
4343

44-
This guide is focused on server-rendered Single-Page Applications using Node.js as the server. Mixing Vue SSR with other backend setups is a topic of its own and is not covered in this guide.
44+
This guide is focused on server-rendered Single-Page Applications using Node.js as the server. Mixing Vue SSR with other backend setups is a topic of its own and briefly discussed in a [dedicated section](./non-node.md).
4545

4646
This guide will be very in-depth and assumes you are already familiar with Vue.js itself, and have decent working knowledge of Node.js and webpack. If you prefer a higher-level solution that provides a smooth out-of-the-box experience, you should probably give [Nuxt.js](https://nuxtjs.org/) a try. It's built upon the same Vue stack but abstracts away a lot of the boilerplate, and provides some extra features such as static site generation. However, it may not suit your use case if you need more direct control of your app's structure. Regardless, it would still be beneficial to read through this guide to better understand how things work together.
4747

en/SUMMARY.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
- [Head Management](head.md)
1111
- [Caching](caching.md)
1212
- [Streaming](streaming.md)
13+
- [Usage in non-Node.js Environments](non-node.md)
1314
- [API Reference](api.md)
1415
- [createRenderer](api.md#createrendereroptions)
1516
- [createBundleRenderer](api.md#createbundlerendererbundle-options)

en/api.md

Lines changed: 20 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,23 +30,27 @@ See [Introducing the Server Bundle](./bundle-renderer.md) and [Build Configurati
3030

3131
## `Class: Renderer`
3232

33-
- #### `renderer.renderToString(vm[, context], callback)`
33+
- #### `renderer.renderToString(vm[, context, callback]): ?Promise<string>`
3434

3535
Render a Vue instance to string. The context object is optional. The callback is a typical Node.js style callback where the first argument is the error and the second argument is the rendered string.
3636

37-
- #### `renderer.renderToStream(vm[, context])`
37+
In 2.5.0+, the callback is also optional. When no callback is passed, the method returns a Promise which resolves to the rendered HTML.
3838

39-
Render a Vue instance to a Node.js stream. The context object is optional. See [Streaming](./streaming.md) for more details.
39+
- #### `renderer.renderToStream(vm[, context]): stream.Readable`
40+
41+
Render a Vue instance to a [Node.js readble stream](https://nodejs.org/dist/latest-v8.x/docs/api/stream.html#stream_readable_streams). The context object is optional. See [Streaming](./streaming.md) for more details.
4042

4143
## `Class: BundleRenderer`
4244

43-
- #### `bundleRenderer.renderToString([context, ]callback)`
45+
- #### `bundleRenderer.renderToString([context, callback]): ?Promise<string>`
4446

4547
Render the bundle to a string. The context object is optional. The callback is a typical Node.js style callback where the first argument is the error and the second argument is the rendered string.
4648

47-
- #### `bundleRenderer.renderToStream([context])`
49+
In 2.5.0+, the callback is also optional. When no callback is passed, the method returns a Promise which resolves to the rendered HTML.
50+
51+
- #### `bundleRenderer.renderToStream([context]): stream.Readable`
4852

49-
Render the bundle to a Node.js stream. The context object is optional. See [Streaming](./streaming.md) for more details.
53+
Render the bundle to a [Node.js readble stream](https://nodejs.org/dist/latest-v8.x/docs/api/stream.html#stream_readable_streams). The context object is optional. See [Streaming](./streaming.md) for more details.
5054

5155
## Renderer Options
5256

@@ -67,6 +71,8 @@ See [Introducing the Server Bundle](./bundle-renderer.md) and [Build Configurati
6771

6872
- `context.state`: (Object) initial Vuex store state that should be inlined in the page as `window.__INITIAL_STATE__`. The inlined JSON is automatically sanitized with [serialize-javascript](https://github.com/yahoo/serialize-javascript) to prevent XSS.
6973

74+
In 2.5.0+, the embed script also self-removes in production mode.
75+
7076
In addition, when `clientManifest` is also provided, the template automatically injects the following:
7177

7278
- Client-side JavaScript and CSS assets needed by the render (with async chunks automatically inferred);
@@ -125,6 +131,14 @@ See [Introducing the Server Bundle](./bundle-renderer.md) and [Build Configurati
125131
})
126132
```
127133

134+
- #### `shouldPrefetch`
135+
136+
- 2.5.0+
137+
138+
A function to control what files should have `<link rel="prefetch">` resource hints generated.
139+
140+
By default, all assets in async chunks will be prefetched since this is a low-priority directive; however you can customize what to prefetch in order to better control bandwidth usage. This option expects the same function signature as `shouldPreload`.
141+
128142
- #### `runInNewContext`
129143

130144
- 2.3.0+

en/basic.md

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,13 @@ renderer.renderToString(app, (err, html) => {
3232
console.log(html)
3333
// => <div data-server-rendered="true">Hello World</div>
3434
})
35+
36+
// in 2.5.0+, returns a Promise if no callback is passed:
37+
renderer.renderToString.then(html => {
38+
console.log(html)
39+
}).catch(err => {
40+
console.error(err)
41+
})
3542
```
3643

3744
## Integrating with a Server
@@ -112,7 +119,7 @@ The template also supports simple interpolation. Given the following template:
112119
<head>
113120
<!-- use double mustache for HTML-escaped interpolation -->
114121
<title>{{ title }}</title>
115-
122+
116123
<!-- use triple mustache for non-HTML-escaped interpolation -->
117124
{{{ meta }}}
118125
</head>

en/non-node.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# Usage in non-Node.js Environments
2+
3+
The default build of `vue-server-renderer` assumes a Node.js environment, which makes it unusable in alternative JavaScript environments such as [php-v8js](https://github.com/phpv8/v8js) or [Nashorn](https://docs.oracle.com/javase/8/docs/technotes/guides/scripting/nashorn/). In 2.5 we have shipped a build in `vue-server-renderer/basic.js` that is largely environment-agnostic, which makes it usable in the environments mentioned above.
4+
5+
For both environments, it is necessary to first prepare the environment by mocking the `global` and `process` objects, with `process.env.VUE_ENV` set to `"server"`, and `process.env.NODE_ENV` set to `"development"` or `"production"`.
6+
7+
In Nashorn, it may also be necessary to provide a polyfill for `Promise` or `setTimeout` using Java's native timers.
8+
9+
Example usage in php-v8js:
10+
11+
``` php
12+
<?php
13+
$vue_source = file_get_contents('/path/to/vue.js');
14+
$renderer_source = file_get_contents('/path/to/vue-server-renderer/basic.js');
15+
$app_source = file_get_contents('/path/to/app.js');
16+
17+
$v8 = new V8Js();
18+
19+
$v8->executeString('var process = { env: { VUE_ENV: "server", NODE_ENV: "production" }}; this.global = { process: process };');
20+
$v8->executeString($vue_source);
21+
$v8->executeString($renderer_source);
22+
$v8->executeString($app_source);
23+
?>
24+
```
25+
26+
---
27+
28+
``` js
29+
// app.js
30+
var vm = new Vue({
31+
template: `<div>{{ msg }}</div>`,
32+
data: {
33+
msg: 'hello'
34+
}
35+
})
36+
37+
// exposed by vue-server-renderer/basic.js
38+
renderVueComponentToString(vm, (err, res) => {
39+
print(res)
40+
})
41+
```

0 commit comments

Comments
 (0)