showToast vite 引入问题

Vite 是一个由 Vue.js 团队开发的新型前端构建工具，它采用渐进式加载的方式加快应用启动速度。如果你遇到引入 `toastr` 或类似 Toast 显示功能的问题，可能是因为 Vite 需要一些额外配置才能在浏览器中正常使用库文件。

1. **安装依赖**：首先确保在项目中安装了 `vite-plugin-vue2` 和 `@vitejs/plugin-vue` 插件，以及你想使用的 Toast 模块（例如 `vue-toastr-loader` 或者 `nuxt-community/toast`），可以使用命令行：

   npm install vue-vite-plugin vue-toastr-loader --save-dev

2. **配置.vitepress/vite.config.js** (如果是 VitePress 项目) 或 `.env` 文件 (全局环境变量) 中启用 Vue 插件支持：

   // vite.config.js
   import { defineConfig } from 'vite';
   import vue from '@vitejs/plugin-vue';

   export default defineConfig({
     plugins: [vue()],
   });

3. **引入并使用**：在需要使用 Toast 的组件中导入模块，并在适当的地方调用它的 API:

   <template>
     <button @click="showToast">显示 Toast</button>
   </template>

   <script>
   import { useToastr } from 'vue-toastr-loader';

   export default {
     setup() {
       const { showSuccess } = useToastr();
       function showToast() {
         showSuccess('这是一个成功的提示!');
       }
       return { showToast };
     },
   };
   </script>