vtils/utils/loadCss.js

一个面向业务的 JavaScript/TypeScript 实用程序库。

import { isBlobUrl } from "./isBlobUrl.js";
import { isDataUrl } from "./isDataUrl.js";
import { isUrl } from "./isUrl.js";
import { loadResource, LoadResourceUrlType } from "./loadResource.js";
var cache = Object.create(null);
/**
 * 加载 CSS 样式，支持链接和内容。
 *
 * @param urlOrContent 链接或内容
 * @example
 * ```typescript
 * loadCss('https://foo.bar/global.css')
 * loadCss(`body { font-size: 20px; }`)
 * ```
 */
export function loadCss(urlOrContent) {
  return (urlOrContent in cache ? Promise.resolve(cache[urlOrContent]) : isUrl(urlOrContent) || isDataUrl(urlOrContent) || isBlobUrl(urlOrContent) ? loadResource({
    type: LoadResourceUrlType.css,
    path: urlOrContent
  }).then(function (res) {
    return res[0];
  }) : new Promise(function (resolve) {
    var el = document.createElement('style');
    el.setAttribute('type', 'text/css');
    if ('textContent' in el) {
      el.textContent = urlOrContent;
    } else {
      // @ts-ignore
      el.styleSheet.cssText = urlOrContent;
    }
    document.getElementsByTagName('head')[0].appendChild(el);
    resolve(el);
  })).then(function (el) {
    cache[urlOrContent] = el;
    return {
      el: el,
      destroy: function destroy() {
        delete cache[urlOrContent];
        el.parentNode.removeChild(el);
      }
    };
  });
}