如何安装vue项目

Vue CLI 官网

2022/02/26

  1. 检查 Vue 是否安装，如果输出 vue 的版本信息，说明安装了 vue
vue  -v
# @vue/cli 4.5.15

如果不存在 vue 命令工具，安装 vue 命令

npm install -g @vue/cli
# OR
yarn global add @vue/cli
  1. 通过 vue 命令，创建一个 hello-world 项目
vue create hello-world

选择 Vue 版本, 通过上下键选择 Default ([Vue 2] babel, eslint)

# Vue CLI v4.5.15
# ? Please pick a preset: (Use arrow keys)
# ❯ Default ([Vue 2] babel, eslint)
#   Default (Vue 3) ([Vue 3] babel, eslint)
#   Manually select features

选择安装，如果成功输出下面内容，如果失败，查看命令行信息，重新安装

# Vue CLI v4.5.15
# ✨  Creating project in /Users/wangyufei/git-project/FD/hello-world.
# 🗃  Initializing git repository...
# ⚙️  Installing CLI plugins. This might take a while...

# added 1280 packages in 39s

# 11 packages are looking for funding
#   run `npm fund` for details
# 🚀  Invoking generators...
# 📦  Installing additional dependencies...


# added 55 packages in 5s

# 11 packages are looking for funding
#   run `npm fund` for details
# ⚓  Running completion hooks...

# 📄  Generating README.md...

# 🎉  Successfully created project hello-world.
# 👉  Get started with the following commands:

#  $ cd hello-world
#  $ npm run serve
  1. 进入生成的 hello-world 目录，通过 npm run serve 命令运行 vue 服务
cd hello-world
npm run serve