vite5-vue3-osx原创macos/windows桌面os系统

[xiaoyan_2018]

vue3-webos一款原创研发的vite5.x+vue3+pinia2+arco.design仿macOS和windows桌面系统os管理平台。支持自定义desk栅格布局引擎、可拖拽桌面图标、多屏分页管理、自定义桌面壁纸主题、毛玻璃虚化背景等功能。

使用技术 

• 技术框架：vite5.3.3+vue3.4.31+vue-router4.4+pinia2
• UI组件库：arco-design^2.55.3 (字节桌面版vue3组件库)
• 状态管理：pinia^2.1.7
• 图表插件：echarts^5.5.1
• 拖拽组件：sortablejs^1.15.2
• 富文本编辑器：wangeditor^4.7.15
• 模拟数据：mockjs^1.1.0
• 样式编译：sass^1.77.8
• 构建工具：vite^5.3.3

整个项目使用vite5.x搭建项目框架，采用vue3 setup语法糖编码开发。 

采用全新的栅格化布局引擎。

// 自定义变量(桌面图标)
const deskVariable = ref({
  '--icon-radius': '8px', // 圆角
  '--icon-size': '60px', // 图标尺寸(设置rpx自定义手机设备)
  '--icon-gap-col': '30px', // 水平间距
  '--icon-gap-row': '30px', // 垂直间距
  '--icon-labelSize': '12px', // 标签文字大小
  '--icon-labelColor': '#fff', // 标签颜色
  '--icon-fit': 'contain', // 图标自适应模式
})

 

目前该项目已经正式完结了，如果想要了解更多技术实现细节，可以去看看这篇分享文章。

https://blog.csdn.net/yanxinyun1990/article/details/140701208