Vue.js 是一个流行的前端框架，可以用于构建现代化的 Web 应用。本文将介绍如何从零创建一个 Vue 项目。
1. 安装 Node.js
在创建 Vue 项目前，需要先安装 Node.js，因为 Vue 依赖 npm（或 yarn）来管理包。
- 访问 Node.js 官网 下载并安装最新版。
- 安装完成后，可以运行以下命令检查安装是否成功：
node -v
npm -v如果成功安装，会输出 Node.js 和 npm 的版本号。
2. 使用 npm 创建 Vue 项目
Vue 官方提供了 create-vue 工具来快速创建 Vue 3 项目。
运行以下命令创建一个新的 Vue 项目：
npm create vue@latest在执行命令后，终端会提示你选择一些选项，例如是否使用 TypeScript、Pinia、Vue Router 等。根据需要进行选择。
如果希望直接指定项目名称，例如 my-vue-app，可以使用：
npm create vue@latest my-vue-app然后进入项目目录：
cd my-vue-app3. 安装依赖
Vue 创建完成后，需要安装项目依赖：
npm install如果你使用 yarn 或 pnpm，也可以使用：
yarn install
# 或
pnpm install4. 启动开发服务器
安装依赖后，运行以下命令启动本地开发服务器：
npm run dev终端会输出一个本地访问地址，例如：
Local: http://localhost:5173/打开浏览器访问该地址，即可看到 Vue 应用的默认页面。
5. 目录结构介绍
Vue 项目生成后，基本的目录结构如下：
my-vue-app/
├── node_modules/ # 依赖包目录
├── public/ # 静态资源
├── src/ # 源代码
│ ├── assets/ # 资源文件
│ ├── components/ # 组件
│ ├── App.vue # 根组件
│ ├── main.js # 入口文件
├── .gitignore # Git 忽略文件
├── package.json # 项目配置文件
├── README.md # 项目说明文件6. 构建生产环境代码
当开发完成后，可以运行以下命令打包生产环境代码：
npm run build生成的静态文件会被放在 dist/ 目录下，可以部署到服务器。
7. 其他常用命令
- 运行测试：
npm run test - 格式化代码：
npm run lint
至此，你已经成功从零创建了一个 Vue 项目，并可以进行开发和部署。希望这篇教程对你有所帮助！