yarn 创建的 vite+vue 项目没有 vite 可执行文件怎么办？

Z时代
2024-02-07
分类：IT

用下面的命令创建了 vue 项目

yarn create vite image_search_web --template vue

然后我想运行这个 vue 项目的时候，发现：

╰─➤ npm run dev 1 ↵ > image_search_web@0.0.0 dev > vite

sh: vite: command not found

说我没有 vite

如何获取这个 vite？需要单独安装吗？

更新

使用 yarn 安装 vite

─➤ yarn add vite yarn add v1.22.19 info No lockfile found. [1/4] ? Resolving packages... warning vue > @vue/compiler-sfc > magic-string > sourcemap-codec@1.4.8: Please use @jridgewell/sourcemap-codec instead [2/4] ? Fetching packages... [3/4] ? Linking dependencies... [4/4] ? Building fresh packages... success Saved lockfile. warning "vite" is already in "devDependencies". Please remove existing entry first before adding it to "dependencies". success Saved 24 new dependencies. info Direct dependencies ├─ @vitejs/plugin-vue@4.0.0 ├─ vite@4.1.1 └─ vue@3.2.47 info All dependencies ├─ @esbuild/darwin-arm64@0.16.17 ├─ @vitejs/plugin-vue@4.0.0 ├─ @vue/compiler-sfc@3.2.47 ├─ @vue/reactivity-transform@3.2.47 ├─ @vue/reactivity@3.2.47 ├─ @vue/runtime-core@3.2.47 ├─ @vue/runtime-dom@3.2.47 ├─ @vue/server-renderer@3.2.47 ├─ csstype@2.6.21 ├─ esbuild@0.16.17 ├─ function-bind@1.1.1 ├─ has@1.0.3 ├─ is-core-module@2.11.0 ├─ nanoid@3.3.4 ├─ path-parse@1.0.7 ├─ picocolors@1.0.0 ├─ postcss@8.4.21 ├─ resolve@1.22.1 ├─ rollup@3.15.0 ├─ source-map-js@1.0.2 ├─ sourcemap-codec@1.4.8 ├─ supports-preserve-symlinks-flag@1.0.0 ├─ vite@4.1.1 └─ vue@3.2.47

✨ Done in 21.12s.

npm 可以运行项目了

➤ npm run dev 130 ↵ > image_search_web@0.0.0 dev > vite VITE v4.1.1 ready in 591 ms ➜ Local: http://localhost:5173/ ➜ Network: use --host to expose

➜ press h to show help

但是直接在终端使用 vite 却是不行的

─➤ vite

zsh: command not found: vite

我在 project 下面搜索包含 vite 字样的文件

─➤ fd vite public/vite.svg

vite.config.js

发现也没有 vite 的可执行文件

贴一下我的 package.json

{
  "name": "image_search_web",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "vue": "^3.2.45"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.0.0",
    "vite": "^4.1.1"
  }
}

vite 为什么不能在终端直接运行？vite 不是一个可执行文件吗？

看到了 vite 的可执行文件了，因为在 .bin 下面，是一个隐藏文件夹，fd 命令默认不搜索隐藏文件夹下面的内容

╰─➤ fd -u vite node_modules/.bin/vite node_modules/.vite/ node_modules/@vitejs/ node_modules/@vitejs/plugin-vue/node_modules/.bin/vite node_modules/vite/ node_modules/vite/bin/vite.js public/vite.svg

vite.config.js