配置vite.config.ts
//vite.config.ts
import fs from 'fs';
import { baseParse } from '@vue/compiler-core';
export default {
vueCustomBlockTransforms: {
// 遇到demo標(biāo)簽就執(zhí)行以下代碼
demo: (options) => {
const { code, path } = options;
const file = fs.readFileSync(path).toString();
// 判斷虛擬節(jié)點(diǎn)是否存在tag為deom的標(biāo)簽
const parsed = baseParse(file).children.find((n) => n.tag === 'demo');
const title = parsed.children[0].content;
// 刪除demo標(biāo)簽
const main = file.split(parsed.loc.source).join('').trim();
// 組件對象增加__sourceCode屬性，值為源代碼
return `export default function (Component) {
Component.__sourceCode = ${JSON.stringify(main)}
Component.__sourceCodeTitle = ${JSON.stringify(title)}
}`.trim();
}
}
};
使用
//需要展示源代碼的文件
<demo>
title
</demo>
<template>
//code
</template>
<script lang="ts">
export default {
//code
};
</script>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。
