vitepress discord-message-components build error

Question

I am writing documentation in Vitepress and I included the discord-message-component in the project, there is no problem in the development phase, but when I want to get the build, the problem I encounter is as follows

build error:
file:///home/root/Development/OSS/docs/docs/.vitepress/.temp/app.js:5
import { install, DiscordButton, DiscordButtons, DiscordEmbed, DiscordEmbedField, DiscordEmbedFields, DiscordInteraction, DiscordMarkdown, DiscordMention, DiscordMessage, DiscordMessages, DiscordReaction, DiscordReactions } from "@discord-message-components/vue";
                  ^^^^^^^^^^^^^
SyntaxError: Named export 'DiscordButton' not found. The requested module '@discord-message-components/vue' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@discord-message-components/vue';
const { install, DiscordButton, DiscordButtons, DiscordEmbed, DiscordEmbedField, DiscordEmbedFields, DiscordInteraction, DiscordMarkdown, DiscordMention, DiscordMessage, DiscordMessages, DiscordReaction, DiscordReactions } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:190:5)

here my index.ts

// https://vitepress.dev/guide/custom-theme
import { h } from 'vue'
import Theme from 'vitepress/theme'
import '@theme/style.css'
import '@theme/custom.css'

import {
    DiscordButton,
    DiscordButtons,
    DiscordEmbed,
    DiscordEmbedField,
    DiscordEmbedFields,
    DiscordInteraction,
    DiscordMarkdown,
    DiscordMention,
    DiscordMessage,
    DiscordMessages,
    DiscordReaction,
    DiscordReactions,
    install as DiscordMessageComponents,
} from '@discord-message-components/vue';
import '@discord-message-components/vue/dist/style.css';

import Footer from './components/Footer.vue'

export default {
  extends: Theme,
  Layout: () => {
    return h(Theme.Layout, null, {
      // https://vitepress.dev/guide/extending-default-theme#layout-slots
      'sidebar-nav-after': () => h(Footer)
    })
  },
  enhanceApp({ app }) {
    app.use(DiscordMessageComponents, {
      profiles: {
        user: {
          author: 'Test User',
          avatar: "https://i.imgur.com/9HlPIUx.jpg",
        },
        bot: {
          author: 'Test Bot',
          avatar: "https://i.imgur.com/9HlPIUx.jpg",
          bot: true,
        },
      },
    });
    
    app.component('DiscordButton', DiscordButton);
    app.component('DiscordButtons', DiscordButtons);
    app.component('DiscordEmbed', DiscordEmbed);
    app.component('DiscordEmbedField', DiscordEmbedField);
    app.component('DiscordEmbedFields', DiscordEmbedFields);
    app.component('DiscordInteraction', DiscordInteraction);
    app.component('DiscordMarkdown', DiscordMarkdown);
    app.component('DiscordMention', DiscordMention);
    app.component('DiscordMessage', DiscordMessage);
    app.component('DiscordMessages', DiscordMessages);
    app.component('DiscordReaction', DiscordReaction);
    app.component('DiscordReactions', DiscordReactions);
  }
}

When I do docs:build it should build without problems because it works fine in docs:dev