全新Nuxt项目添加Vuetify模块后运行pnpm run dev报错

问题原因 #

虽然vuetify-nuxt-module官方宣称无需额外配置，但它默认依赖Material Design Icons（mdi）作为图标集。而pnpm默认不会自动安装peer依赖，导致@mdi/font包缺失，进而触发Failed to resolve import "vuetify/iconsets/mdi"错误。

解决步骤 #

1. 手动安装@mdi/font依赖

   pnpm add @mdi/font
   

2. （可选）显式配置图标集（确保模块正确识别）
   在项目根目录的nuxt.config.ts中添加以下配置：

   export default defineNuxtConfig({
     modules: ['vuetify-nuxt-module'],
     vuetify: {
       icons: {
         defaultSet: 'mdi'
       }
     }
   })
   

3. 重启开发服务器

   pnpm run dev
   

如果以上步骤仍未解决问题，可尝试清除pnpm缓存后重新安装所有依赖：

pnpm store prune
pnpm install
pnpm run dev

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