# macos-web-tsx-project

**Repository Path**: shareloke/macos-web-tsx-project

## Basic Information

- **Project Name**: macos-web-tsx-project
- **Description**: vue3+ts+naiveui+jsx 仿macos桌面
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 10
- **Forks**: 3
- **Created**: 2023-10-07
- **Last Updated**: 2025-06-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<h1 align="center">macos-web-tsx-project</h1>

<div align="center">
     <a href="https://v3.vuejs.org/" target="_blank">
         <img alt="vue.js" src="https://img.shields.io/badge/vue.js-3.3.4-blue?logo=vue.js">
     </a>
     <a href="https://www.naiveui.com/zh-CN/light" target="_blank">
         <img alt="naive ui" src="https://img.shields.io/badge/naive%20ui->2.34.4-blue">
     </a>
     <a href="https://www.tslang.cn/" target="_blank">
         <img alt="typescript" src="https://img.shields.io/badge/typescript->5.2.0-blue?logo=typescript">
     </a>
     <a href="https://vitejs.dev/" target="_blank">
         <img src="https://img.shields.io/badge/vite-%3E4.4.9-yellow?logo=vite" alt="vite">
     </a>
     <a href="https://gitee.com/shareloke/macos-web-tsx-project/blob/main/LICENSE" target="_blank">
         <img src="https://img.shields.io/badge/license-MIT-success" alt="license">
     </a>
 </div>

### 🌈 简介

基于 vue3.x + typescript + vite + naive ui + tailwindcss + jsx + vue-router + pinia，
仿macos桌面前端项目，开源免费模版，希望减少工作量和学习新技术，希望能够帮助大家；
本人主要从事的是后端开发，对于前端我也是刚入门的小白，有很多的东西还没有学透，项目里面的用法和写法以及思想都是借鉴别人的，
业余的时间都会去看看大佬们写的项目，这个项目也算是练练手吧，希望大家能够多多提提建议，请联系QQ：526412864

### 🔨 环境支持

| Edge      | Firefox      | Chrome      | Safari      |
|-----------|--------------|-------------|-------------|
| Edge ≥ 80 | Firefox ≥ 79 | Chrome ≥ 68 | Safari ≥ 12 |

### 📖 使用说明

建议使用 pnpm 因为 yarn 有时会报错。建议node 版本 > 18.xx.x

```shell
# 克隆项目
git clone https://gitee.com/shareloke/macos-web-tsx-project.git

# 进入项目
cd macos-web-tsx-project

# 安装依赖
pnpm i

# 运行项目
pnpm dev

# 打包发布
pnpm build-prod

```

### ✂️ 项目截图

桌面
![img.png](doc/images/desktop.png)

启动台
![img.png](doc/images/lanuchpad.png)

锁屏
![img.png](doc/images/lockscreen.png)

运行程序
![img.png](doc/images/app.png)

### 🎉 支持作者

如果觉得框架不错，或者已经在使用了，希望你可以去 [Gitee](https://gitee.com/shareloke/macos-web-tsx-project.git) 帮我点个 ⭐
Star，这将是对我极大的鼓励与支持。