安装shadcn-extension缩略图轮播时遭遇ENOENT目录不存在错误

API 探路者

2026-6-16

解决shadcn-extension带缩略图轮播组件CLI安装失败的问题

核心问题定位

报错ENOENT: no such file or directory说明CLI尝试写入的目标路径components/ui/extension不存在，或目录权限不足导致无法创建文件。

手动创建缺失的目录
先确认项目中components/ui/extension文件夹是否存在，若不存在，手动创建：
```
# Windows终端
mkdir components\ui\extension

# 类Unix终端（WSL、Mac）
mkdir -p components/ui/extension
```
完成后重新运行安装CLI命令。
跳过CLI，手动安装组件
如果CLI仍无法正常工作，直接手动添加组件文件：
1. 创建components/ui/extension/carousel.tsx文件
2. 复制shadcn-extension文档中带缩略图的轮播组件源码到该文件
3. 确保依赖齐全，执行以下命令安装轮播所需依赖：
```
npm install embla-carousel-react embla-carousel-autoplay
# 或使用 yarn: yarn add embla-carousel-react embla-carousel-autoplay
# 或 pnpm: pnpm add embla-carousel-react embla-carousel-autoplay
```
检查Next.js路径配置
打开项目根目录的tsconfig.json（或jsconfig.json），确认paths配置正确映射组件目录，示例：
```
{
  "compilerOptions": {
    "paths": {
      "@/components/*": ["./components/*"]
    }
  }
}
```
这能保证你在代码中正确导入新安装的带缩略图轮播组件：
```
import { Carousel } from "@/components/ui/extension/carousel"
```
验证Windows文件权限
若你的项目在Windows系统下，检查项目文件夹的读写权限：右键项目文件夹 → 属性 → 安全选项卡 → 确保当前登录用户拥有“修改”权限。