自定义类名失效

[LuoTianOrange]

我在使用js的vite+vue3项目中，使用unplugin-vue-markdown来加载markdown-it-link-to-card插件

import Markdown from 'unplugin-vue-markdown/vite'
import MarkdownItAnchor from 'markdown-it-anchor'
import markdownItPrism from 'markdown-it-prism'
import { linkToCardPlugin } from "@luckrya/markdown-it-link-to-card"
import markdownItHighlightjs from 'markdown-it-highlightjs'

export default defineConfig({
  base: '/',
  css: {
    postcss: {
      plugins: [tailwind(), autoprefixer()],
    },
  },
  plugins: [
    ...,
    Markdown({
          headEnabled: true,
          markdownItOptions: {
            html: true,
            linkify: true,
            typographer: true,
          },
          markdownItSetup(md) {
            md.use(MarkdownItAnchor)
            md.use(markdownItHighlightjs)
            md.use(markdownItPrism, { plugins: ['line-numbers'] })
            md.use(linkToCardPlugin, { size: 'small',classPrefix: 'markdown-card' })
          },
          wrapperClasses: "markdown-body cat-markdown", 
        }),
    ...
]

index.css：

.markdown-card__container {
  display: flex;
  align-items: center;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 5px;
  background-color: #f9f9f9;
  margin-bottom: 10px;
}

.markdown-card__img {
  width: 50px;
  height: 50px;
  margin-right: 10px;
  object-fit: cover;
}

.markdown-card__texts {
  display: flex;
  flex-direction: column;
}

.markdown-card__texts--title {
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 5px;
}

.markdown-card__texts--desc {
  font-size: 14px;
  color: #666;
}

没有按预期生成自定义类名，而是生成了自定义属性

是哪一个步骤做错了吗