addStylesServer.js
2.11 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
var listToStyles = require('./listToStyles')
module.exports = function (parentId, list, isProduction, context) {
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__
}
if (context) {
if (!context.hasOwnProperty('styles')) {
Object.defineProperty(context, 'styles', {
enumerable: true,
get: function() {
return renderStyles(context._styles)
}
})
// expose renderStyles for vue-server-renderer (vuejs/#6353)
context._renderStyles = renderStyles
}
var styles = context._styles || (context._styles = {})
list = listToStyles(parentId, list)
if (isProduction) {
addStyleProd(styles, list)
} else {
addStyleDev(styles, list)
}
}
}
// In production, render as few style tags as possible.
// (mostly because IE9 has a limit on number of style tags)
function addStyleProd (styles, list) {
for (var i = 0; i < list.length; i++) {
var parts = list[i].parts
for (var j = 0; j < parts.length; j++) {
var part = parts[j]
// group style tags by media types.
var id = part.media || 'default'
var style = styles[id]
if (style) {
if (style.ids.indexOf(part.id) < 0) {
style.ids.push(part.id)
style.css += '\n' + part.css
}
} else {
styles[id] = {
ids: [part.id],
css: part.css,
media: part.media
}
}
}
}
}
// In dev we use individual style tag for each module for hot-reload
// and source maps.
function addStyleDev (styles, list) {
for (var i = 0; i < list.length; i++) {
var parts = list[i].parts
for (var j = 0; j < parts.length; j++) {
var part = parts[j]
styles[part.id] = {
ids: [part.id],
css: part.css,
media: part.media
}
}
}
}
function renderStyles (styles) {
var css = ''
for (var key in styles) {
var style = styles[key]
css += '<style data-vue-ssr-id="' + style.ids.join(' ') + '"' +
(style.media ? ( ' media="' + style.media + '"' ) : '') + '>' +
style.css + '</style>'
}
return css
}