This commit is contained in:
zhangguoyun committed 2025-10-27 13:47:06 +08:00
1 parent 77544a5c30
commit 742eb7040f
10 files changed
+220 -233

No files matched your search

-4
View File
@@ -1,4 +0,0 @@
# These are supported funding model platforms
github: jooy2
custom: ["https://cdget.com/donate"]
-38
View File
@@ -1,38 +0,0 @@
name: 'Bug report'
description: Report a bug in this project.
labels: ['bug']
body:
- type: markdown
attributes:
value: |
Before creating an issue, please read the following:
- Read the `README.md` file on the project page or the documentation file and compare your code to the intent of the project.
- Search to see if the same issue already exists, and keep the title concise and accurate so that it's easy for others to understand and search for.
- Please create a separate issue for each type of issue.
- For modular projects, make sure you're using the latest version of the module.
- Please be as detailed as possible and write in English so that we can handle your issue quickly.
- type: textarea
attributes:
label: Describe the bug
description: |
For the issue you are experiencing, please describe in detail what you are seeing, the error message, and the impact of the issue. If you are able to reproduce the issue, please list the steps in order. You can attach an image or video if necessary.
validations:
required: true
- type: textarea
attributes:
label: Expected behavior
description: Describe how it should be handled when it's normal behavior or what needs to be fixed.
validations:
- type: input
attributes:
label: Your environment - System OS
description: Please describe the full range of OSes you are experiencing the issue with, preferably including the version.
placeholder: Windows 11, macOS 15.x, Linux Ubuntu 24.04, Android 15, iOS 16...
validations:
- type: input
attributes:
label: Your environment - Web Browser
description: If relevant, please describe the web browser you are currently using.
placeholder: Google Chrome, Microsoft Edge, Mozilla Firefox...
validations:
-1
View File
@@ -1 +0,0 @@
blank_issues_enabled: true
@@ -1,18 +0,0 @@
name: 'Feature request'
description: Report a feature request in this project.
labels: ['enhancement']
body:
- type: markdown
attributes:
value: |
Before creating an issue, please read the following:
- Search to see if the same issue already exists, and keep the title concise and accurate so that it's easy for others to understand and search for.
- Please create a separate issue for each type of issue.
- Please be as detailed as possible and write in English so that we can handle your issue quickly.
- type: textarea
attributes:
label: Describe the feature
description: Feel free to describe any features or improvements you would like to see. You can attach text or images of examples, behavior, etc. from other projects to elaborate.
validations:
required: true
-18
View File
@@ -1,18 +0,0 @@
name: 'Fix typo request'
description: Request to fix a typo or bad translation in this project
labels: ['typo']
body:
- type: markdown
attributes:
value: |
Before creating an issue, please read the following:
- Search to see if the same issue already exists, and keep the title concise and accurate so that it's easy for others to understand and search for.
- Please create a separate issue for each type of issue.
- Please be as detailed as possible and write in English so that we can handle your issue quickly.
- type: textarea
attributes:
label: Describe the issue
description: Please describe where the typo occurs and a list of text that needs to be corrected.
validations:
required: true
-24
View File
@@ -1,24 +0,0 @@
<!--
Thank you for contributing to the project. Your contribution will be reviewed and approved after appropriate review.
Please read the caveats below to ensure a fast merge.
-->
## Pull request checklist
You should familiarize yourself with the files `README.md`, `CONTRIBUTING.md`, and `CODE_OF_CONDUCT.md` in the root of your project.
- If an issue has been created for this, add `(fixes #{ISSUE_NUMBER})` to the end of the commit description. In `{ISSUE_NUMBER}`, please include the relevant issue number.
- If you need to update or add to the article, please update the relevant content. If a multilingual article exists, you should update all relevant content in your own language, except for translations.
- Add or update test code if it exists and is needed. Also, verify that the tests pass.
- If this PR is not yet complete, keep the PR in draft status. If it's no longer valid, close the PR with an explanation.
<!--
Below is a template for describing this PR. It's not required, so please delete the content below if you don't need it.
-->
### What did you change?
### Why did you make the change?
### How does this work?
Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

-66
View File
@@ -1,66 +0,0 @@
name: app-test
on:
push:
branches: [main]
paths:
- '**'
- '!LICENSE'
- '!*.md'
- '!docs/**'
- '!.github/**'
- '.github/workflows/app-test.yml'
pull_request:
branches: [main]
workflow_dispatch:
jobs:
app-test:
runs-on: ${{ matrix.os }}
name: Test Node.js ${{ matrix.node_version }} on ${{ matrix.os }}
strategy:
fail-fast: false
matrix:
node_version: ['20', '22', '24']
os: [windows-latest, macos-latest, ubuntu-latest]
steps:
- uses: actions/checkout@v4
with:
fetch-depth: 0
- name: Install xvfb
if: runner.os == 'Linux'
run: |
sudo apt install -y -q --no-install-recommends xvfb
- name: Setup Node.js ${{ matrix.node_version }}
uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node_version }}
cache: npm
cache-dependency-path: '**/package-lock.json'
- name: Cache dependencies
uses: actions/cache@v4
id: npm-cache
with:
path: |
**/node_modules
key: ${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}
restore-keys: |
${{ runner.os }}-npm-
- name: Install dependencies
if: steps.npm-cache.outputs.cache-hit != 'true'
run: npm i
- name: Test module script (Windows or macOS)
if: runner.os != 'Linux'
run: |
npm run test
- name: Test module script (Linux)
if: runner.os == 'Linux'
run: |
npm run test:linux
-64
View File
@@ -1,64 +0,0 @@
name: documents
on:
# run every time a push occurs in the docs folder
push:
branches: [main]
paths:
- docs/**
- README.md
# trigger deployment manually
workflow_dispatch:
jobs:
build-documentation-pages:
runs-on: ubuntu-latest
defaults:
run:
working-directory: ./docs
steps:
- uses: actions/checkout@v4
with:
# fetch all commits to get last updated time or other git log info
fetch-depth: 0
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: '24'
# cache node_modules
- name: Cache dependencies
uses: actions/cache@v4
id: npm-cache
with:
path: |
**/node_modules
key: ${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}
restore-keys: |
${{ runner.os }}-npm-
# install dependencies if the cache did not hit
- name: Install dependencies
if: steps.npm-cache.outputs.cache-hit != 'true'
run: npm install
# run build script
- name: Build VitePress site
run: npm run build
# please check out the docs of the workflow for more details
# @see https://github.com/crazy-max/ghaction-github-pages
- name: Deploy to GitHub Pages
uses: crazy-max/ghaction-github-pages@v4
with:
# deploy to gh-pages branch
target_branch: gh-pages
# deploy the default output dir of VitePress
build_dir: docs/dist
jekyll: false
fqdn: 'vutron.cdget.com'
env:
# @see https://docs.github.com/en/actions/reference/authentication-in-a-workflow#about-the-github_token-secret
GITHUB_TOKEN: ${{ secrets.ACCESS_TOKEN }}
+220
View File
@@ -0,0 +1,220 @@
# Vutron - Vite + Vue 3 + Electron Template
## Project Overview
Vutron is a preconfigured template for developing cross-platform desktop applications using modern web technologies. The project combines:
- **Vite** as the build tool and development server
- **Vue 3** with TypeScript for the user interface
- **Electron** for creating desktop applications
- **Vuetify** as the UI component library
- **Pinia** for state management
- **vue-i18n** for internationalization
- **Playwright** for automated testing
The template provides a ready-to-use development environment with hot-reload, cross-platform build support, automated testing, and theme management (dark/light).
## Architecture
The project follows the typical Electron architecture with three main processes:
### Main Process (`src/main/`)
- Handles application lifecycle
- Manages windows and system integration
- Located in `src/main/index.ts`
- Also includes utilities, tray functionality, and IPC handlers
### Preload Process (`src/preload/`)
- Acts as an isolated bridge between main and renderer processes
- Uses `contextBridge` to securely expose APIs to the renderer
- Located in `src/preload/index.ts`
### Renderer Process (`src/renderer/`)
- Contains the Vue 3 application
- Uses Vuetify for UI components
- Located in `src/renderer/` with:
- Components (`src/renderer/components/`)
- Screens/views (`src/renderer/screens/`)
- Router (`src/renderer/router/index.ts`)
- State management with Pinia (`src/renderer/store/`)
- Internationalization (`src/renderer/locales/`)
- Utility functions (`src/renderer/utils/`)
## Building and Running
### Prerequisites
- Node.js >= 20.0.0
- pnpm package manager (recommended)
### Development
```bash
# Install dependencies
pnpm install
# Start development server with hot-reload
pnpm dev
# Development with debug info
pnpm dev:debug
# Force reinstall dependencies and start development
pnpm dev:debug:force
```
### Building
```bash
# Build for all platforms
pnpm build:all
# Build for specific platforms
pnpm build:mac # macOS
pnpm build:win # Windows
pnpm build:linux # Linux
# Build without packaging (useful for quick testing)
pnpm build:dir
# Run type checking, formatting, and build
pnpm build
```
### Testing
```bash
# Run Playwright tests
pnpm test
# Run tests on Linux with virtual display
pnpm test:linux
```
### Linting and Formatting
```bash
# Check for linting issues
pnpm lint
# Fix linting issues automatically
pnpm lint:fix
# Format code with Prettier
pnpm format
# Format and fix code automatically
pnpm format:fix
```
## Key Features
1. **Hot Module Replacement**: Develop with instant feedback via Vite's fast hot-reload
2. **Type Safety**: Full TypeScript support across the application
3. **Internationalization**: Built-in multi-language support (11 languages available)
4. **Theme Management**: Easy switching between dark and light themes
5. **State Management**: Pinia for reactive state management
6. **Cross-platform Builds**: Build for Windows, macOS, and Linux from a single codebase
7. **Testing**: Integrated Playwright testing setup
8. **Logging**: electron-log for both main and renderer processes
9. **Security**: Secure IPC communication between processes
## Project Structure
```
├── buildAssets/ # Build configurations and icons
├── dist/ # Build output directory
├── docs/ # Documentation
├── node_modules/ # Dependencies
├── src/ # Source code
│ ├── main/ # Electron main process code
│ ├── preload/ # Preload script for context isolation
│ └── renderer/ # Vue application code
│ ├── components/ # Vue components
│ ├── locales/ # Translation files
│ ├── plugins/ # Vue plugins (i18n, Pinia, Vuetify)
│ ├── router/ # Vue Router configuration
│ ├── screens/ # Application views/pages
│ ├── store/ # Pinia stores
│ ├── utils/ # Utility functions
│ ├── App.vue # Root component
│ ├── index.html # HTML entry point
│ └── main.ts # Vue application entry point
├── tests/ # Test files
├── .vscode/ # VS Code settings
├── .editorconfig # Editor configuration
├── .gitignore # Git ignore rules
├── .prettierignore # Prettier ignore rules
├── .prettierrc # Prettier configuration
├── eslint.config.ts # ESLint configuration
├── package.json # Project dependencies and scripts
├── playwright.config.ts # Playwright test configuration
├── pnpm-lock.yaml # Dependency lock file
├── pnpm-workspace.yaml # pnpm workspace configuration
├── README.md # Project documentation
├── tsconfig.json # TypeScript configuration
├── tsconfig.node.json # TypeScript configuration for Node.js files
└── vite.config.mts # Vite configuration
```
## Development Conventions
1. **Code Style**:
- Uses ESLint with TypeScript and Vue plugin
- Formatted with Prettier
- Follows Vue 3 Composition API with TypeScript
2. **Component Structure**:
- Components use Vue 3's `<script setup>` syntax
- Written in TypeScript with proper typing
- Utilize Vuetify components for UI
3. **Internationalization**:
- Uses vue-i18n for multi-language support
- Translation files stored in `src/renderer/locales/`
- Keys are organized in JSON format
4. **State Management**:
- Uses Pinia for state management
- Stores are defined in `src/renderer/store/`
- Follow Pinia's composition store pattern
5. **Routing**:
- Uses Vue Router with web hash history
- Routes defined in `src/renderer/router/index.ts`
6. **IPC Communication**:
- Secure communication between main and renderer processes
- Uses whitelisted channels defined in preload script
- Accessible via `window.mainApi` in renderer process
## Internationalization
The application supports multiple languages with the following locale files:
- English (`en`)
- Korean (`ko`)
- Simplified Chinese (`zh-hans`)
- Traditional Chinese (`zh-hant`)
- German (`de`)
- Spanish (`es`)
- Japanese (`ja`)
- French (`fr`)
- Russian (`ru`)
- Portuguese (`pt`)
- Dutch (`nl`)
## Electron Integration
The application integrates with Electron features through:
- IPC communication for sending messages between processes
- Native file dialog support
- External link opening
- Application version retrieval
- Error handling and logging
## Testing
The project includes Playwright for end-to-end testing, with configuration in `playwright.config.ts` and test files in the `tests/` directory.
## Build Outputs
Building creates different distribution formats based on the platform:
- **macOS**: DMG installer for x64, arm64, and universal architectures
- **Windows**: APPX, ZIP, Portable, and NSIS installers (x64)
- **Linux**: SNAP, DEB, and RPM packages (x64)
Artifacts are named with the format `${productName} ${version}_${arch}.${ext}` and stored in the `release/${version}` directory.