当前位置：首页 > news >正文

vue3:项目创建

news 来源：原创 2025/5/24 23:07:10

一、nodejs的安装及验证

1、下载及安装

下载 | Node.js 中文网https://nodejs.cn/download/不会的可根据网上的安装步骤完成，一搜就有

2、验证是否安装成功

win+r

输入命令检查版本是否存在

node -v 检查node是否安装成功

npm -v 检查其中的npm是否安装成功

像上图出现版本表示安装成功

二、创建vue项目

1、选择一个文件夹，在此路径下打开“运行”对话框

路径下直接输入cmd回车打开

2、输入命令，创建vue项目

①使用 Vue 官方提供的脚手架工具来快速生成一个 Vue 3 项目。

npm create vue@latest

Ok to proceed? (y): 这是 npm 的一个提示，询问你是否确认要继续执行当前操作。

**y**: 输入 y 表示“是”（yes），即同意继续。
如果你不想继续，可以输入 n 或其他任何内容来取消操作。

②输入项目基本需求

可根据自己的需求选择是否需要这些东西

这里主要选择内容：

项目名称：cms-study

是否引入Vue Router 进行单页面应用开发：是（）

是否引入Pinia用于状态管理：是

Vue Router

主要作用是管理应用中的路由和页面跳转，使得在单页面应用中可以实现多页面的效果，而无需每次加载新的 HTML 页面。

Pinia 的使用场景

全局状态管理：

当多个组件需要共享同一份数据时（例如用户登录信息、主题设置等），可以使用 Pinia 来集中管理这些状态。

复杂业务逻辑：

当组件的逻辑变得复杂时，可以将逻辑提取到 Pinia 的 Store 中，使组件更专注于渲染。

跨组件通信：

当组件之间需要频繁传递数据时，可以使用 Pinia 作为中介，避免 props 和 events 的繁琐。