download: 测试必学：探秘大厂全链路品质保障体系

创立插件入口文件 —— index.ts

上面，咱们来创立插件入口文件 —— index.ts。

vite 的插件反对 ts，所以这里咱们间接应用 typescript 来编写这个插件。
该文件的内容次要是蕴含了 name、enforce、transform 三个属性。

name: 插件名称；
enforce: 该插件在 plugin-vue 插件之前执行，这样就能够间接解析到原模板文件；
transform: 代码转译，这个函数的性能相似于 webpack 的 loader。

export default function markdownPlugin(): Plugin {
  return {
    // 插件名称
    name: 'vite:markdown',

    // 该插件在 plugin-vue 插件之前执行，这样就能够间接解析到原模板文件
    enforce: 'pre',

    // 代码转译，这个函数的性能相似于 `webpack` 的 `loader`
    transform(code, id, opt) {}}
}

module.exports = markdownPlugin
markdownPlugin['default'] = markdownPlugin

过滤非指标文件

接下来，咱们要对文件进行过滤，将非 vue 文件、未应用 g-markdown 标签的 vue 文件进行过滤，不做转换。

在 transform 函数的结尾，退出上面这行正则代码进行判断即可。

const vueRE = /\.vue$/;
const markdownRE = /\<g-markdown.*\/\>/g;
if (!vueRE.test(id) || !markdownRE.test(code)) return code;