@small-vue/runtime-dom/dist/runtime-dom.esm.js

简版vue3 runtime-dom

import { createRenderer } from '@small-vue/runtime-core';
export * from '@small-vue/runtime-core';

// 创建元素
function createElement(type) {
    // svg元素指定命名空间
    if (/^(svg|rect|circle|ellipse|line|polygon|polyline|path|text|defs|stop|linearGradient|radialGradient|pattern|clipPath|filter|mask|g|use|image)$/.test(type)) {
        return document.createElementNS("http://www.w3.org/2000/svg", type);
    }
    return document.createElement(type);
}
// 设置属性
function patchProp(el, key, prevVal, nextVal) {
    // 事件监听
    if (/^on[A-Z]/.test(key)) {
        const event = key.slice(2).toLowerCase();
        el.addEventListener(event, nextVal);
        if (prevVal) {
            el.removeEventListener(event, prevVal);
        }
    }
    // 普通属性
    else {
        if (nextVal === null || nextVal === undefined) {
            el.removeAttribute(key);
        }
        else {
            el.setAttribute(key, nextVal);
        }
    }
}
// 插入到父元素
function insert(child, parent, anchor = null) {
    parent.insertBefore(child, anchor);
}
// 删除元素
function remove(el) {
    el.remove();
}
function setElementText(el, text) {
    el.textContent = text;
}
const renderer = createRenderer({
    createElement,
    patchProp,
    insert,
    remove,
    setElementText,
});
const createApp = (...args) => {
    return renderer.createApp(...args);
};

export { createApp };