为何mdsvex会导致Vite开发服务器报错？

我尝试在新创建的SvelteKit项目中配置mdsvex来处理Markdown文件，但运行项目时出现了Vite导入错误。

复现步骤 #

• 执行 npm create svelte@latest ./ 初始化SvelteKit项目
• 运行 npm i -D mdsvex 安装mdsvex依赖
• 仅保留routes文件夹中默认生成的 +page.svelte 文件

我的配置 #

mdsvex官方文档对svelte.config.js的配置说明不够清晰，我基于SvelteKit默认配置做了如下修改：

svelte.config.js

import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/kit/vite';
import { mdsvex } from "mdsvex"

/** @type {import('@sveltejs/kit').Config} */
const config = {
    // Consult https://kit.svelte.dev/docs/integrations#preprocessors
    // for more information about preprocessors
    extensions: [".svx"], // 新增该行
    preprocess: [
        vitePreprocess(),
        mdsvex({ // 新增mdsvex配置
            extensions: [".svx"] // 指定扩展名
        }),
    ],

    kit: {
        // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
        // If your environment is not supported or you settled on a specific environment, switch out the adapter.
        // See https://kit.svelte.dev/docs/adapters for more information about adapters.
        adapter: adapter()
    }
};

export default config;

问题现象 #

仅修改上述配置文件后，执行 npm run dev 并访问本地站点时出现报错：

内容的提问来源于stack exchange，提问作者Carl