Vue3 前端项目新建步骤记录

学习现有的工具来自己配置一个admin-web

主要步骤

  1. 新建一个基于vue3, 由vite的项目
  2. 开发环境配置(webstorm)
  3. 跑起来的hello world
  4. 基本布局
  5. API引入
  6. 登录功能
  7. 导航菜单动态生成
  8. 单点登录的token刷新

新建一个基于vue3, 由vite的项目

首先新建项目.

# 使用vite create 新建vue3 项目
npm create vite@latest
# 安装依赖
npm install
# dev运行
npm run dev

图片

跑起来的hello world

图片

基本布局

选用常用上中下布局及侧边栏布局。
图片

引入 devui-vue 框架来做

npm i vue-devui @devui-design/icons devui-theme

设置App.vue
  1. API引入
  2. 登录功能
  3. 导航菜单动态生成
  4. 单点登录的token刷新
posted @ 2025-08-08 16:52  nextkara  阅读(8)  评论(0)    收藏  举报