# React Widgets Template

**Repository Path**: springmorningcxx/react-widgets-template

## Basic Information

- **Project Name**: React Widgets Template
- **Description**: ⚛ 一个使用 React、TypeScript 和 Vite 构建的桌面风格应用模板，具有类似桌面应用的界面设计和导航功能。基于 React 19、TypeScript 和 Vite 7 构建。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-08-03
- **Last Updated**: 2025-08-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React Widgets Template
一个使用 React、TypeScript 和 Vite 构建的桌面风格应用模板，具有类似桌面应用的界面设计和导航功能。基于 React 19、TypeScript 和 Vite 7 构建。

<div align="center">

  ![React](https://img.shields.io/badge/React-19.1.0-%2361DAFB?logo=react) 
  ![TypeScript](https://img.shields.io/badge/TypeScript-5.8.3-%233178C6?logo=typescript) 
  ![Vite](https://img.shields.io/badge/Vite-7.0.4-%23646CFF?logo=vite) 
  ![License](https://img.shields.io/badge/许可证-春晓PSL-84dd84)
</div>

## 开发缘由
之前用Web技术（例如Electron、Tauri、pywebview）开发桌面应用时，发现我之前的应用一眼就能看出是Web套壳的。为了改变这一点，我决定开发一个有桌面软件味的桌面应用模板。

## 特点
除了最基本的React、React Router、React Router、TypeScript、Vite。我只安装了字节的IconPark库来提供图标。你需要自行安装需要的依赖。 

## 使用例
我并没有根据具体的框架来设计，需要你自行修改代码。
1. 设置无边框窗口与拖拽功能
以pywebview为例，你需要在`webview.create_window`设置`frameless=True`和`easy_drag=True`，并在标题栏的元素中添加`pywebview-drag-region`类名。

2. 为最小化、最大化、关闭按钮绑定事件

3. 修改完成后打包成HTML文件


## 预览
![preview](./preview.png)