花了3天爆肝升级之前原创项目vite8+vue3+pinia3+arcoDesign+echarts网页版os管理系统。

vite8-webos支持macos/windows两种桌面风格，全新栅格桌面菜单拖拽功能，dock动效菜单。

技术栈

• 编辑器：vscode
• 技术框架：vite8.0+vue3.5+vue-router5+pinia3
• UI组件库：arco-design^2.58.0 (字节vue3组件库)
• 状态管理：pinia^3.0.4
• 图表插件：echarts^6.1.0
• 富文本编辑器：wangeditor^4.7.15
• 模拟数据：mockjs^1.1.0
• 样式处理：sass^1.100.0

vite8-vue3-webos网页版os系统，已经发布到我的原创小店。

项目框架目录

全新vite8+vue3搭建项目模板，vue3 setup语法开发页面。

主入口配置

import { createApp } from 'vue'
import './style.scss'
import App from './App.vue'

// 引入arco.design组件库
import ArcoDesign from '@arco-design/web-vue'
import '@arco-design/web-vue/dist/arco.css'
// 额外引入图标库
import ArcoIcon from '@arco-design/web-vue/es/icon'

// 引入路由及状态管理
import Router from './router'
import Pinia from './pinia'

const app = createApp(App)

app
.use(ArcoDesign)
.use(ArcoIcon)
.use(Router)
.use(Pinia)
.mount('#app')

vite批量路由配置

/**
 * 路由管理Router
 * @author andy
 */

import { createRouter, createWebHashHistory } from 'vue-router'
import { authState } from '@/pinia/modules/auth'

import Layout from '@/layouts/index.vue'

// 批量导入路由
const modules = import.meta.glob('./modules/*.js', { eager: true })
console.log(modules)
const patchRouters = Object.keys(modules).map(key => modules[key].default).flat()
console.log(patchRouters)

const routes = [
  {
    path: '/',
    redirect: '/desktop',
  },
  ...patchRouters,
  // 错误模块
  {
    path: '/:pathMatch(.*)*',
    redirect: '/404',
    component: Layout,
    meta: {
      title: '404error',
    },
    children: [
      {
        path: '404',
        component: () => import('@/views/error/404.vue'),
      }
    ]
  },
]

const router = createRouter({
  history: createWebHashHistory(),
  routes,
})

// 全局路由钩子拦截
router.beforeEach((to, from) => {
  const authstate = authState()
  // 登录验证
  if(to?.meta?.requireAuth && !authstate.authorization) {
    console.log('你还未登录!')
    return {
      path: '/login'
    }
  }
})

综上就是vite8+vue3升级款webos管理系统的一些项目分享，感谢大家的阅读于支持。

Electron38.2实战客户端OS系统|vite7+vue3+electron仿mac/wins桌面

2025最新款Electron38+Vite7+Vue3+ElementPlus桌面客户端后台管理系统Exe

最新研发vite7.0+electron38客户端仿微信EXE聊天软件

Vite8-Naive-Admin高颜值web版通用后台管理模板

2026/6升级版Flutter3.41.5桌面级OS管理系统

最新款uni-app+vue3+mp-html快速对接deepseek-v4-pro跨三端ai智能助手

Flutter3.41实战抖音直播+短视频+聊天

基于Flutter3.41+DeepSeek+Dio+Get搭建APP版智能生成式AI助手

基于vite8.0+electron41+deepseek跨平台ai桌面助手

首发vite8.0+vue3+deepseek+markdown手搓网页版ai流式生成模板