Vue3+Vite获取原始文版并展示在页面内

借助 Vite提供的方法与预格式化的文本标签<pre>在页面中展示原本内容

<template>
  <pre>{{ TestRaw }}</pre>
</template>

<script setup lang="ts">
import TestRaw from './test.vue?raw'

defineOptions({
  name: 'test',
})
</script>

<style scoped></style>

• import TestRaw from './test.vue?raw'：
  • 这行代码借助 ?raw 后缀导入 test.vue 文件的原始代码内容。?raw 是 Vite 提供的功能，它可以让你直接获取文件的原始文本内容，而非将其作为模块处理。
  • 导入的内容会被赋值给 TestRaw 变量。

• <pre> 标签用于保留文本的原始格式，包含空格和换行符，通常用来展示代码。