hexo-theme-shokax 0.4.0-alpha.1 → 0.4.0-alpha.2

package/_config.yml

@@ -269,7 +269,8 @@ footer:
     word2: 秋 #第二个字
   icp: # ICP备案
     enable: false
-    icon: "beian.webp" #网安备案图片
+    # 请在登录后从 https://beian.mps.gov.cn/web/business/businessHome/website 下载对应图标
+    icon: "" #网安备案图片
     icpnumber: "xxx" # ICP备案号
     beian: "xxx" # 网安备案号
     recordcode: "xxx" # 网安备案链接中的recordcode参数
@@ -363,9 +364,9 @@ vendors:
 #    pjax: npm_webcache|theme-shokax-pjax@0.0.3/pjax.shokax.min.js
 #    anime: npm_webcache|theme-shokax-anime@0.0.6/anime.shokax.min.js
 #    lozad: npm_webcache|lozad@1.16.0/dist/lozad.min.js
-    algolia: bytedance|algoliasearch/4.12.1/algoliasearch-lite.umd.min.js
-    instantsearch: bytedance|instantsearch.js/4.39.0/instantsearch.production.min.js
-    quicklink: npm_webcache|quicklink@2.3.0/dist/quicklink.umd.js
+#    algolia: bytedance|algoliasearch/4.12.1/algoliasearch-lite.umd.min.js
+#    instantsearch: bytedance|instantsearch.js/4.39.0/instantsearch.production.min.js
+#    quicklink: npm_webcache|quicklink@2.3.0/dist/quicklink.umd.js
 #    mouse_firework: npm_webcache|mouse-firework@0.0.4/dist/index.umd.js
   async_js:
     fancybox: bytedance|??jquery/3.5.1/jquery.min.js,fancybox/3.5.7/jquery.fancybox.min.js,justifiedGallery/3.8.1/js/jquery.justifiedGallery.min.js

package/layout/_partials/footer.pug

@@ -33,7 +33,7 @@ div(class="status")
             - var beianN = theme.footer.icp?.beian, RC=theme.footer.icp?.recordcode
             if beianN && RC
                 br
-                a(target="_blank" href=`https://www.beian.gov.cn/portal/registerSystemInfo?recordcode=${RC}`)
+                a(target="_blank" href=`https://beian.mps.gov.cn/#/query/webSearch?code=${RC}`)
                     img(src=theme.statics + theme.assets + '/' + theme.footer.icp.icon style="max-width: 2em;display:inline;" width="20" height="20")
                     != beianN
     != shokax_inject('status')

package/layout/_partials/head/head.pug

@@ -38,11 +38,17 @@ each prelink in prelinks
 each dnsLink in dnslinks
     link(rel="dns-prefetch" href=dnsLink)
 
-- var fontConfig = theme?.font?.loadFromGoogle
+- var fontConfig = theme.font?.loadFromGoogle
 if fontConfig
     != _vendor_font()
 != _css('app.css')
 
+if theme.polyfill.enable
+    script(src=`https://polyfill.io/v3/polyfill.min.js?features=${theme.polyfill.features}` defer)
+
+!= vendor_js()
+!= _js('siteInit.js')
+
 include pwa.pug
 if tk
     script(src=theme.twikoo.link )

package/layout/_partials/header.pug

@@ -11,7 +11,7 @@ nav(id="nav")
                     != alternate || title
         ul(class="right" id="rightNav")
             li(class="item theme" @click="changeThemeByBtn")
-                i(class="ic" :class="{'i-sun': !themeStatus,'i-moon': themeStatus}")
+                i(class="ic i-sun")
             li(class="item search")
                 i(class="ic i-search")
             != shokax_inject('rightNav')

package/layout/_partials/layout.pug

@@ -115,16 +115,6 @@ html(lang=page.language?page.language:config.language, style=theme.grayMode ? 'f
                 ]
             };
 
-        if theme.polyfill.enable
-            script(src=`https://polyfill.io/v3/polyfill.min.js?features=${theme.polyfill.features}`)
-
-        - debugVue = theme?.experiments?.debug
-        if debugVue
-            script(src="https://cdn.bootcdn.net/ajax/libs/vue/3.3.4/vue.global.min.js")
-        else
-            script(src="https://cdn.bootcdn.net/ajax/libs/vue/3.3.4/vue.global.prod.min.js")
-        != vendor_js()
-        != _js('app.js')
         != partial('_partials/third-party/baidu-analytics.pug', {}, {cache: true})
         != partial('_partials/third-party/clarity.pug', {}, {cache: true})
         != partial('_partials/third-party/google-analytics.pug', {}, {cache: true})

package/layout/_partials/post/footer.pug

@@ -16,10 +16,9 @@ div(class="meta")
         script(type = "module" data-pjax).
             import { pageviewCount } from 'https://unpkg.com/@waline/client@2/dist/pageview.mjs';
 
-            const path = document.getElementById("twikoo_visitors").getAttribute("data-path");
             pageviewCount({
                 serverURL: '#{theme.waline.serverURL}',
-                path: path,
+                path: window.location.pathname,
             });
 
     != shokax_inject('postMeta')

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "hexo-theme-shokax",
-    "version": "0.4.0-alpha.1",
+    "version": "0.4.0-alpha.2",
     "description": "a hexo theme based on shoka",
     "main": "index.js",
     "repository": "https://github.com/theme-shoka-x/hexo-theme-shokaX",
@@ -16,26 +16,31 @@
         "@types/jquery": "^3.5.29",
         "@types/js-yaml": "^4.0.9",
         "@types/node": "^20.11.10",
+        "@types/quicklink": "^2.3.4",
         "@typescript-eslint/eslint-plugin": "^6.20.0",
         "@typescript-eslint/parser": "^6.20.0",
+        "@waline/client": "3.0.0-alpha.11",
         "eslint": "^8.56.0",
         "eslint-config-standard": "~17",
         "eslint-plugin-import": "^2.29.1",
         "eslint-plugin-n": "^16.6.2",
         "eslint-plugin-promise": "^6.1.1",
         "eslint-plugin-vue": "^9.20.1",
-        "instantsearch.js": "^4.64.1",
         "typescript": "^5.3.3",
         "vue": "^3.4.15"
     },
     "dependencies": {
+        "@algolia/client-search": "^4.22.1",
+        "algoliasearch": "4.22.1",
         "esbuild": "^0.20.0",
         "hexo": "7.0.0",
         "hexo-fs": "^4.1.1",
         "hexo-pagination": "^3.0.0",
         "hexo-util": "^3.2.0",
+        "instantsearch.js": "^4.64.2",
         "js-yaml": "^4.1.0",
         "mouse-firework": "^0.0.5",
+        "quicklink": "^2.3.0",
         "theme-shokax-anime": "^0.0.6",
         "theme-shokax-pjax": "^0.0.3",
         "unlazy": "^0.10.4"

package/scripts/generaters/archive.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // @ts-ignore
 const hexo_pagination_1 = __importDefault(require("hexo-pagination"));
 // @ts-ignore
-const fmtNum = num => {
+const fmtNum = (num) => {
     return num < 10 ? '0' + num : num;
 };
 if (!(hexo.config.archive && hexo.config.archive.enabled === false)) {

package/scripts/generaters/script.js

@@ -1,34 +1,11 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 /* global hexo */
 const package_json_1 = __importDefault(require("../../package.json"));
-const fs = __importStar(require("hexo-fs"));
+const node_fs_1 = __importDefault(require("node:fs"));
 const esbuild_1 = require("esbuild");
 const utils_1 = require("../utils");
 hexo.extend.generator.register('script', function (locals) {
@@ -83,19 +60,17 @@ hexo.extend.generator.register('script', function (locals) {
     if (theme?.audio) {
         siteConfig.audio = theme.audio;
     }
-    let text;
     let enterPoint;
-    if (fs.existsSync('themes/shokaX/source/js/_app/pjax/siteInit.ts')) {
+    if (node_fs_1.default.existsSync('themes/shokaX/source/js/_app/pjax/siteInit.ts')) {
         enterPoint = 'themes/shokaX/source/js/_app/pjax/siteInit.ts';
     }
     else {
         enterPoint = 'node_modules/hexo-theme-shokax/source/js/_app/pjax/siteInit.ts';
     }
-    text = 'const CONFIG = ' + JSON.stringify(siteConfig) + ';';
     (0, esbuild_1.buildSync)({
         entryPoints: [enterPoint],
         bundle: true,
-        outfile: 'shokax_temp.js',
+        outdir: 'shokaxTemp',
         tsconfigRaw: {
             compilerOptions: {
                 target: 'ES2022',
@@ -106,9 +81,12 @@ hexo.extend.generator.register('script', function (locals) {
             }
         },
         platform: 'browser',
-        format: 'iife',
+        format: 'esm',
         target: ['es2022'],
         minify: true,
+        legalComments: 'linked',
+        mainFields: ['module', 'main'],
+        splitting: true,
         define: {
             __UNLAZY_LOGGING__: 'false',
             __UNLAZY_HASH_DECODING__: theme.modules.unlazyHash ? 'true' : 'false',
@@ -119,16 +97,44 @@ hexo.extend.generator.register('script', function (locals) {
             __shokax_outime__: theme.outime.enable ? 'true' : 'false',
             __shokax_tabs__: theme.modules.tabs ? 'true' : 'false',
             __shokax_quiz__: theme.modules.quiz ? 'true' : 'false',
-            __shokax_fancybox__: theme.modules.fancybox ? 'true' : 'false'
+            __shokax_fancybox__: theme.modules.fancybox ? 'true' : 'false',
+            shokax_CONFIG: JSON.stringify(siteConfig)
+        },
+        alias: {
+            'algoliasearch/lite': 'algoliasearch/dist/algoliasearch-lite.esm.browser.js'
         }
     });
-    text += fs.readFileSync('shokax_temp.js');
-    const result = hexo.render.renderSync({ text, engine: 'js' });
-    fs.unlinkSync('shokax_temp.js');
-    return {
-        path: theme.js + '/app.js',
-        data: function () {
-            return result;
+    const res = [];
+    node_fs_1.default.readdirSync('./shokaxTemp').forEach((file) => {
+        const fileText = node_fs_1.default.readFileSync(`./shokaxTemp/${file}`, { encoding: 'utf-8' });
+        if (file.endsWith('js')) {
+            const result = hexo.render.renderSync({ text: fileText, engine: 'js' });
+            res.push({
+                path: theme.js + '/' + file,
+                data: function () {
+                    return result;
+                }
+            });
         }
-    };
+        else if (file.endsWith('css')) {
+            const result = hexo.render.renderSync({ text: fileText, engine: 'css' });
+            res.push({
+                path: theme.css + '/' + file,
+                data: function () {
+                    return result;
+                }
+            });
+        }
+        else {
+            res.push({
+                path: theme.js + '/' + file,
+                data: function () {
+                    return fileText;
+                }
+            });
+        }
+        node_fs_1.default.unlinkSync(`./shokaxTemp/${file}`);
+    });
+    node_fs_1.default.rmSync('./shokaxTemp', { force: true, recursive: true });
+    return res;
 });

package/scripts/helpers/asset.js

@@ -126,7 +126,7 @@ hexo.extend.helper.register('_css', function (...urls) {
 });
 hexo.extend.helper.register('_js', function (...urls) {
     const { statics, js } = hexo.theme.config;
-    return urls.map(url => (0, hexo_util_1.htmlTag)('script', { src: hexo_util_1.url_for.call(this, `${statics}${js}/${url}?v=${package_json_1.default.version}`) }, '')).join('');
+    return urls.map(url => (0, hexo_util_1.htmlTag)('script', { src: hexo_util_1.url_for.call(this, `${statics}${js}/${url}?v=${package_json_1.default.version}`), type: 'module', fetchpriority: 'high' }, '')).join('');
 });
 hexo.extend.helper.register('vendor_js', function () {
     const vendors = hexo.theme.config.vendors;

package/scripts/helpers/list_categories.js

@@ -1,5 +1,3 @@
-'use strict';
-/* global hexo */
 const prepareQuery = (categories, parent) => {
     const query = {
         parent: undefined
@@ -13,7 +11,6 @@ const prepareQuery = (categories, parent) => {
     return categories.find(query).sort('name', 1).filter(cat => cat.length);
 };
 hexo.extend.helper.register('_list_categories', function (depth = 0) {
-    // let hexo = this
     const categories = this.site.categories;
     if (!categories || !categories.length)
         return '';
@@ -48,7 +45,6 @@ hexo.extend.helper.register('_list_categories', function (depth = 0) {
     return hierarchicalList(0);
 });
 hexo.extend.helper.register('_category_prev', function (name) {
-    // let hexo = this
     const categories = this.site.categories;
     if (!categories || !categories.length)
         return '';

package/scripts/plugin/lib/injects.js

@@ -1,4 +1,4 @@
-'use strict';
+"use strict";
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };

package/source/js/_app/components/comments.ts

@@ -0,0 +1,33 @@
+import { CONFIG } from '../globals/globalVars'
+import { init, pageviewCount } from '@waline/client'
+
+// await import('@waline/client/style')
+// fixme 处理样式引入问题
+
+export const walineComment = function () {
+  init({
+    el: '#comments',
+    serverURL: CONFIG.waline.serverURL,
+    lang: CONFIG.waline.lang,
+    locale: CONFIG.waline.locale,
+    emoji: CONFIG.waline.emoji,
+    meta: CONFIG.waline.meta,
+    requiredMeta: CONFIG.waline.requiredMeta,
+    wordLimit: CONFIG.waline.wordLimit,
+    pageSize: CONFIG.waline.pageSize,
+    pageview: CONFIG.waline.pageview,
+    path: window.location.pathname,
+    dark: 'html[data-theme="dark"]'
+  })
+}
+
+export const walinePageview = function () {
+  pageviewCount({
+    serverURL: CONFIG.waline.serverURL,
+    path: window.location.pathname
+  })
+}
+
+export const walineRecentComments = async function () {
+
+}

package/source/js/_app/components/sidebar.ts

@@ -1,10 +1,12 @@
 /* 边栏分区 */
 
-import { Container, diffY, menuToggle, showContents, sideBar } from '../globals/globalVars'
+import { CONFIG, Container, diffY, menuToggle, showContents, sideBar } from '../globals/globalVars'
 import { clipBoard } from '../globals/tools'
 import { pageScroll, transition } from '../library/anime'
 import { $dom } from '../library/dom'
+import initProto, { child, getHeight, setDisplay } from '../library/proto'
 
+initProto()
 export const sideBarToggleHandle = (event:Event, force?:number) => {
   if (sideBar.hasClass('on')) {
     sideBar.removeClass('on')
@@ -31,7 +33,7 @@ export const sideBarToggleHandle = (event:Event, force?:number) => {
 }
 
 export const sideBarTab = () => {
-  const sideBarInner = sideBar.child('.inner')
+  const sideBarInner = child(sideBar, '.inner')
 
   if (sideBar.child('.tab')) {
     sideBarInner.removeChild(sideBar.child('.tab'))
@@ -45,13 +47,13 @@ export const sideBarTab = () => {
 
     if (element.innerHTML.trim().length < 1) {
       if (item === 'contents') {
-        showContents.display('none')
+        setDisplay(showContents, 'none')
       }
       return
     }
 
     if (item === 'contents') {
-      showContents.display('')
+      setDisplay(showContents, '')
     }
 
     const tab = document.createElement('li')
@@ -212,7 +214,7 @@ export const backToTopHandle = () => {
 }
 
 export const goToBottomHandle = () => {
-  pageScroll(parseInt(String(Container.changeOrGetHeight())))
+  pageScroll(parseInt(String(getHeight(Container))))
 }
 
 export const goToCommentHandle = () => {

package/source/js/_app/globals/globalVars.ts

@@ -2,6 +2,7 @@ import { $dom } from '../library/dom'
 import Pjax from 'theme-shokax-pjax'
 import initProto from '../library/proto'
 
+export const CONFIG = shokax_CONFIG
 initProto()
 export const statics = CONFIG.statics.indexOf('//') > 0 ? CONFIG.statics : CONFIG.root
 export const scrollAction: { x: number, y: number } = { x: 0, y: 0 }

package/source/js/_app/globals/handles.ts

@@ -18,18 +18,19 @@ import {
   setSiteNavHeight,
   setHeaderHightInner,
   setHeaderHight,
-  setOWinHeight, setOWinWidth, setDiffY, setTitleTime
+  setOWinHeight, setOWinWidth, setDiffY, setTitleTime, CONFIG
 } from './globalVars'
 import { changeMetaTheme } from './themeColor'
 import { Loader } from './thirdparty'
+import {getHeight, setWidth} from '../library/proto'
 
 export const resizeHandle = () => {
   // 获取 siteNav 的高度
-  setSiteNavHeight(siteNav.changeOrGetHeight())
+  setSiteNavHeight(getHeight(siteNav))
   // 获取 siteHeader 的高度
-  setHeaderHightInner(siteHeader.changeOrGetHeight())
+  setHeaderHightInner(getHeight(siteHeader))
   // 获取 #waves 的高度
-  setHeaderHight(headerHightInner + $dom('#waves').changeOrGetHeight())
+  setHeaderHight(headerHightInner + getHeight($dom('#waves')))
 
   // 判断窗口宽度是否改变
   if (oWinWidth !== window.innerWidth) {
@@ -90,7 +91,7 @@ export const scrollHandle = () => {
   }
   // 更新百分比进度条的宽度
   if ($dom('#sidebar').hasClass('affix') || $dom('#sidebar').hasClass('on')) {
-    $dom('.percent').changeOrGetWidth(scrollPercent)
+    setWidth($dom('.percent'), scrollPercent)
   }
 }
 

package/source/js/_app/globals/themeColor.ts

@@ -1,6 +1,6 @@
 import { $storage } from '../library/storage'
 import { $dom } from '../library/dom'
-import { HTML } from './globalVars'
+import { CONFIG, HTML } from './globalVars'
 
 /**
  * 更改日夜模式

package/source/js/_app/globals/thirdparty.ts

@@ -1,6 +1,6 @@
 // 与第三方js的交互或第三方嵌入js
 
-import { loadCat } from './globalVars'
+import { CONFIG, loadCat } from './globalVars'
 import { transition } from '../library/anime'
 
 // 加载动画

package/source/js/_app/globals/tools.ts

@@ -1,7 +1,8 @@
 import { pageScroll } from '../library/anime'
 import { $dom } from '../library/dom'
 import { $storage } from '../library/storage'
-import { BODY, LOCAL_HASH, LOCAL_URL, scrollAction, setLocalHash } from './globalVars'
+import { BODY, CONFIG, LOCAL_HASH, LOCAL_URL, scrollAction, setLocalHash } from './globalVars'
+import { createChild } from '../library/proto'
 
 // 显示提示(现阶段用于版权及复制结果提示)
 export const showtip = (msg: string): void | never => {
@@ -9,7 +10,7 @@ export const showtip = (msg: string): void | never => {
     return
   }
 
-  const tipbox = BODY.createChild('div', {
+  const tipbox = createChild(BODY, 'div', {
     innerHTML: msg,
     className: 'tip'
   })

package/source/js/_app/library/anime.ts

@@ -1,6 +1,7 @@
 import anime from 'theme-shokax-anime'
 import { siteNavHeight } from '../globals/globalVars'
 import type { AnimeOptions } from 'theme-shokax-anime/dist/types'
+import {getTop, setDisplay} from './proto'
 
 /**
  * 参数  动画效果
@@ -26,7 +27,7 @@ export const transition = (target: HTMLElement, type: number|string|Function, co
     case 'bounceUpIn':
       animation = {
         begin (anim) {
-          target.display('block')
+          setDisplay(target, 'block')
         },
         translateY: [
           { value: -60, duration: 200 },
@@ -41,7 +42,7 @@ export const transition = (target: HTMLElement, type: number|string|Function, co
     case 'shrinkIn':
       animation = {
         begin (anim) {
-          target.display('block')
+          setDisplay(target, 'block')
         },
         scale: [
           { value: 1.1, duration: 300 },
@@ -54,7 +55,7 @@ export const transition = (target: HTMLElement, type: number|string|Function, co
     case 'slideRightIn':
       animation = {
         begin (anim) {
-          target.display('block')
+          setDisplay(target, 'block')
         },
         translateX: ['100%', '0%'],
         opacity: [0, 1]
@@ -82,7 +83,7 @@ export const transition = (target: HTMLElement, type: number|string|Function, co
       begin && begin()
     },
     complete () {
-      target.display(display)
+      setDisplay(target, display)
       complete && complete()
     }
   }, animation)).play()
@@ -100,7 +101,7 @@ export const pageScroll = (target: HTMLElement|number, offset?: number, complete
     // 动画缓动函数
     easing: 'easeInOutQuad',
     // 如果 offset 存在，则滚动到 offset，如果 target 是数字，则滚动到 target，如果 target 是 DOM 元素，则滚动到下述表达式
-    scrollTop: offset || (typeof target === 'number' ? target : (target ? target.getTop() + document.documentElement.scrollTop - siteNavHeight : 0)),
+    scrollTop: offset || (typeof target === 'number' ? target : (target ? getTop(target) + document.documentElement.scrollTop - siteNavHeight : 0)),
     // 完成回调函数
     complete () {
       complete && complete()

package/source/js/_app/library/declare.d.ts

@@ -27,6 +27,8 @@ declare interface EventTarget {
   hasClass(className: string): boolean;
 }
 
+type walineMeta = 'nick'|'mail'|'link'
+
 declare const LOCAL: {
   path: string;
   ignores: Array<(uri:string)=>boolean>;
@@ -53,7 +55,7 @@ declare const LOCAL: {
     show: string
   }
 }
-declare const CONFIG: {
+interface configType {
   hostname: string;
   fireworks: any;
   audio: AudioItem[];
@@ -92,20 +94,25 @@ declare const CONFIG: {
     fancybox: string
   }
   search: any,
-  valine: string
+  waline: {
+    serverURL: string
+    lang: string
+    locale: object
+    emoji: boolean
+    meta: walineMeta[]
+    requiredMeta: walineMeta[]
+    wordLimit: number
+    pageSize: number
+    pageview: boolean
+  }
+  walinePageView: boolean
   quicklink: {
     ignores: any
     timeout: number
-    priority: string
+    priority: boolean
   }
   playerAPI: string
 }
-declare const instantsearch: any
-
-declare function algoliasearch(appID: string, apiKey: string): any;
-
-declare const quicklink: any
-
 // esbuild 静态常量
 declare const __shokax_player__:boolean
 declare const __shokax_fireworks__:boolean
@@ -115,3 +122,5 @@ declare const __shokax_outime__:boolean
 declare const __shokax_tabs__: boolean
 declare const __shokax_quiz__: boolean
 declare const __shokax_fancybox__: boolean
+declare const __shokax_waline__:boolean
+declare const shokax_CONFIG:configType

package/source/js/_app/library/loadFile.ts

@@ -1,4 +1,6 @@
 import { getScript } from './scriptPjax'
+import { CONFIG } from '../globals/globalVars'
+import { createChild } from './proto'
 
 /**
  * 用途是根据不同的资源名称和类型生成相应的资源 URL。
@@ -31,7 +33,7 @@ export const vendorCss = (type: string, condition?: string): void => {
   }
 
   if (LOCAL[type]) {
-    document.head.createChild('link', {
+    createChild(document.head, 'link', {
       rel: 'stylesheet',
       href: assetUrl('css', type)
     })