Skip to content

Commit 94d5e33

Browse files
yyx990803yyx990803
committed
use lodash.template for ssr templates by default
1 parent bce51f3 commit 94d5e33

File tree

8 files changed

+66
-28
lines changed

8 files changed

+66
-28
lines changed

‎flow/modules.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,3 +35,9 @@ declare module 'serialize-javascript' {
3535
(input: string, options: { isJSON: boolean }): string
3636
}
3737
}
38+
39+
declare module 'lodash.template' {
40+
declare var exports: {
41+
(input: string, options: { interpolate: RegExp, escape: RegExp }): Function
42+
}
43+
}

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,7 @@
9595
"karma-sourcemap-loader": "^0.3.0",
9696
"karma-webpack": "^2.0.1",
9797
"lodash": "^4.17.1",
98+
"lodash.template": "^4.4.0",
9899
"lru-cache": "^4.0.2",
99100
"nightwatch": "^0.9.9",
100101
"nightwatch-helpers": "^1.2.0",

‎packages/vue-server-renderer/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
"chalk": "^1.1.3",
2222
"hash-sum": "^1.0.2",
2323
"he": "^1.1.0",
24+
"lodash.template": "^4.4.0",
2425
"resolve": "^1.2.0",
2526
"source-map": "0.5.6",
2627
"serialize-javascript": "^1.3.0"

‎src/server/create-renderer.js

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -51,8 +51,8 @@ export function createRenderer ({
5151
done: (err: ?Error, res: ?string) => any,
5252
context?: ?Object
5353
): void {
54-
if (!template && context && clientManifest) {
55-
exposeAssetRenderFns(context, templateRenderer)
54+
if (context) {
55+
templateRenderer.bindRenderFns(context)
5656
}
5757
let result = ''
5858
const write = createWriteFunction(text => {
@@ -75,13 +75,13 @@ export function createRenderer ({
7575
component: Component,
7676
context?: ?Object
7777
): stream$Readable {
78+
if (context) {
79+
templateRenderer.bindRenderFns(context)
80+
}
7881
const renderStream = new RenderStream((write, done) => {
7982
render(component, write, context, done)
8083
})
8184
if (!template) {
82-
if (context && clientManifest) {
83-
exposeAssetRenderFns(context, templateRenderer)
84-
}
8585
return renderStream
8686
} else {
8787
const templateStream = templateRenderer.createStream(context)
@@ -94,11 +94,3 @@ export function createRenderer ({
9494
}
9595
}
9696
}
97-
98-
// Expose preload/prefetch and script render fns when client manifest is
99-
// available.
100-
function exposeAssetRenderFns (context: Object, renderer: TemplateRenderer) {
101-
context.renderPreloadLinks = renderer.renderPreloadLinks.bind(renderer, context)
102-
context.renderPrefetchLinks = renderer.renderPrefetchLinks.bind(renderer, context)
103-
context.renderScripts = renderer.renderScripts.bind(renderer, context)
104-
}

‎src/server/template-renderer/index.js

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,13 @@ export default class TemplateRenderer {
6060
}
6161
}
6262

63+
bindRenderFns (context: Object) {
64+
const renderer: any = this
65+
;['Links', 'State', 'Scripts', 'Styles'].forEach(type => {
66+
context[`render${type}`] = renderer[`render${type}`].bind(renderer, context)
67+
})
68+
}
69+
6370
// render synchronously given rendered app content and render context
6471
renderSync (content: string, context: ?Object) {
6572
const template = this.parsedTemplate
@@ -68,19 +75,27 @@ export default class TemplateRenderer {
6875
}
6976
context = context || {}
7077
return (
71-
template.head +
78+
template.head(context) +
7279
(context.head || '') +
73-
this.renderPreloadLinks(context) +
74-
this.renderPrefetchLinks(context) +
75-
(context.styles || '') +
76-
template.neck +
80+
this.renderLinks(context) +
81+
this.renderStyles(context) +
82+
template.neck(context) +
7783
content +
7884
this.renderState(context) +
7985
this.renderScripts(context) +
80-
template.tail
86+
template.tail(context)
8187
)
8288
}
8389

90+
renderStyles (context: Object): string {
91+
// context.styles is a getter exposed by vue-style-loader
92+
return context.styles || ''
93+
}
94+
95+
renderLinks (context: Object): string {
96+
return this.renderPreloadLinks(context) + this.renderPrefetchLinks(context)
97+
}
98+
8499
renderPreloadLinks (context: Object): string {
85100
const usedAsyncFiles = this.getUsedAsyncFiles(context)
86101
if (this.preloadFiles || usedAsyncFiles) {

‎src/server/template-renderer/parse-template.js

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
11
/* @flow */
22

3+
const compile = require('lodash.template')
4+
const compileOptions = {
5+
escape: /{{[^{]([\s\S]+?)[^}]}}/g,
6+
interpolate: /{{{([\s\S]+?)}}}/g
7+
}
8+
39
export type ParsedTemplate = {
4-
head: string;
5-
neck: string;
6-
tail: string;
10+
head: (data: any) => string;
11+
neck: (data: any) => string;
12+
tail: (data: any) => string;
713
};
814

915
export function parseTemplate (
@@ -29,8 +35,8 @@ export function parseTemplate (
2935
}
3036

3137
return {
32-
head: template.slice(0, i),
33-
neck: template.slice(i, j),
34-
tail: template.slice(j + contentPlaceholder.length)
38+
head: compile(template.slice(0, i), compileOptions),
39+
neck: compile(template.slice(i, j), compileOptions),
40+
tail: compile(template.slice(j + contentPlaceholder.length), compileOptions)
3541
}
3642
}

‎src/server/template-renderer/template-stream.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export default class TemplateStream extends Transform {
3333

3434
start () {
3535
this.started = true
36-
this.push(this.template.head)
36+
this.push(this.template.head(this.context))
3737

3838
// inline server-rendered head meta information
3939
if (this.context.head) {
@@ -57,7 +57,7 @@ export default class TemplateStream extends Transform {
5757
this.push(this.context.styles)
5858
}
5959

60-
this.push(this.template.neck)
60+
this.push(this.template.neck(this.context))
6161
}
6262

6363
_flush (done: Function) {
@@ -75,7 +75,7 @@ export default class TemplateStream extends Transform {
7575
this.push(scripts)
7676
}
7777

78-
this.push(this.template.tail)
78+
this.push(this.template.tail(this.context))
7979
done()
8080
}
8181
}

‎yarn.lock

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3190,6 +3190,10 @@ lodash._isiterateecall@^3.0.0:
31903190
version "3.0.9"
31913191
resolved "https://registry.yarnpkg.com/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz#5203ad7ba425fae842460e696db9cf3e6aac057c"
31923192

3193+
lodash._reinterpolate@~3.0.0:
3194+
version "3.0.0"
3195+
resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
3196+
31933197
lodash._stack@^4.0.0:
31943198
version "4.1.3"
31953199
resolved "https://registry.yarnpkg.com/lodash._stack/-/lodash._stack-4.1.3.tgz#751aa76c1b964b047e76d14fc72a093fcb5e2dd0"
@@ -3253,6 +3257,19 @@ lodash.rest@^4.0.0:
32533257
version "4.0.5"
32543258
resolved "https://registry.yarnpkg.com/lodash.rest/-/lodash.rest-4.0.5.tgz#954ef75049262038c96d1fc98b28fdaf9f0772aa"
32553259

3260+
lodash.template@^4.4.0:
3261+
version "4.4.0"
3262+
resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-4.4.0.tgz#e73a0385c8355591746e020b99679c690e68fba0"
3263+
dependencies:
3264+
lodash._reinterpolate "~3.0.0"
3265+
lodash.templatesettings "^4.0.0"
3266+
3267+
lodash.templatesettings@^4.0.0:
3268+
version "4.1.0"
3269+
resolved "https://registry.yarnpkg.com/lodash.templatesettings/-/lodash.templatesettings-4.1.0.tgz#2b4d4e95ba440d915ff08bc899e4553666713316"
3270+
dependencies:
3271+
lodash._reinterpolate "~3.0.0"
3272+
32563273
lodash@3.10.1, lodash@^3.8.0:
32573274
version "3.10.1"
32583275
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"

0 commit comments

Comments
 (0)