vue hello world项目
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

70 lines
1.9 KiB

import listToStyles from './listToStyles'
export default function addStylesToShadowDOM (parentId, list, shadowRoot) {
var styles = listToStyles(parentId, list)
addStyles(styles, shadowRoot)
}
/*
type StyleObject = {
id: number;
parts: Array<StyleObjectPart>
}
type StyleObjectPart = {
css: string;
media: string;
sourceMap: ?string
}
*/
function addStyles (styles /* Array<StyleObject> */, shadowRoot) {
const injectedStyles =
shadowRoot._injectedStyles ||
(shadowRoot._injectedStyles = {})
for (var i = 0; i < styles.length; i++) {
var item = styles[i]
var style = injectedStyles[item.id]
if (!style) {
for (var j = 0; j < item.parts.length; j++) {
addStyle(item.parts[j], shadowRoot)
}
injectedStyles[item.id] = true
}
}
}
function createStyleElement (shadowRoot) {
var styleElement = document.createElement('style')
styleElement.type = 'text/css'
shadowRoot.appendChild(styleElement)
return styleElement
}
function addStyle (obj /* StyleObjectPart */, shadowRoot) {
var styleElement = createStyleElement(shadowRoot)
var css = obj.css
var media = obj.media
var sourceMap = obj.sourceMap
if (media) {
styleElement.setAttribute('media', media)
}
if (sourceMap) {
// https://developer.chrome.com/devtools/docs/javascript-debugging
// this makes source maps inside style tags work properly in Chrome
css += '\n/*# sourceURL=' + sourceMap.sources[0] + ' */'
// http://stackoverflow.com/a/26603875
css += '\n/*# sourceMappingURL=data:application/json;base64,' + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + ' */'
}
if (styleElement.styleSheet) {
styleElement.styleSheet.cssText = css
} else {
while (styleElement.firstChild) {
styleElement.removeChild(styleElement.firstChild)
}
styleElement.appendChild(document.createTextNode(css))
}
}