huiyi-h5/build/vite/vconsole.ts
2024-02-10 16:25:41 +08:00

45 lines
1.4 KiB
TypeScript

import path from 'node:path'
import { viteVConsole } from 'vite-plugin-vconsole'
export function createViteVConsole() {
return viteVConsole({
entry: [path.resolve('src/main.ts')],
enabled: false,
config: {
maxLogNumber: 1000,
theme: 'light',
},
// https://github.com/vadxq/vite-plugin-vconsole/issues/21
dynamicConfig: {
theme: `document.documentElement.classList.contains('dark') ? 'dark' : 'light'`,
},
eventListener: `
const targetElement = document.querySelector('html'); // 择要监听的元素
const observerOptions = {
attributes: true, // 监听属性变化
attributeFilter: ['class'] // 只监听class属性变化
};
// 定义回调函数来处理观察到的变化
function handleAttributeChange(mutationsList) {
for(let mutation of mutationsList) {
if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
if (window && window.vConsole) {
window.vConsole.dynamicChange.value = new Date().getTime();
}
}
}
}
// 创建观察者实例并传入回调函数
const observer = new MutationObserver(handleAttributeChange);
// 开始观察目标元素
observer.observe(targetElement, observerOptions);
// 当不再需要观察时,停止观察
// observer.disconnect();
`,
})
}