Milky Warp 项目教程

Milky Warp 项目教程

milky-warpSimple magnifier for presentations (so that people can read the tiny texts)项目地址:https://gitcode.com/gh_mirrors/mi/milky-warp

1. 项目的目录结构及介绍

Milky Warp 项目的目录结构如下：

milky-warp/
├── src-tauri/
│   ├── src/
│   ├── icons/
│   ├── target/
│   ├── tauri.conf.json
│   ├── Cargo.toml
│   └── Cargo.lock
├── src/
│   ├── assets/
│   ├── components/
│   ├── config/
│   ├── router/
│   ├── store/
│   ├── views/
│   ├── App.vue
│   ├── main.ts
│   └── shims-vue.d.ts
├── public/
│   └── index.html
├── .gitignore
├── LICENSE
├── README.md
├── package.json
├── pnpm-lock.yaml
├── tsconfig.json
├── tsconfig.node.json
└── vite.config.ts

目录结构介绍

• src-tauri/: Tauri 应用的核心目录，包含 Rust 代码和配置文件。
  • src/: Rust 源代码文件。
  • icons/: 应用图标文件。
  • target/: 编译输出目录。
  • tauri.conf.json: Tauri 配置文件。
  • Cargo.toml: Rust 项目的依赖和元数据配置文件。
  • Cargo.lock: Rust 项目的依赖锁定文件。
• src/: Vue 应用的源代码目录。
  • assets/: 静态资源文件。
  • components/: Vue 组件文件。
  • config/: 配置文件。
  • router/: 路由配置文件。
  • store/: Vuex 状态管理文件。
  • views/: 页面视图文件。
  • App.vue: 主应用组件。
  • main.ts: 应用入口文件。
  • shims-vue.d.ts: Vue 类型声明文件。
• public/: 公共资源目录，包含 index.html 文件。
• .gitignore: Git 忽略文件配置。
• LICENSE: 项目许可证文件。
• README.md: 项目说明文档。
• package.json: Node.js 项目的依赖和脚本配置文件。
• pnpm-lock.yaml: pnpm 依赖锁定文件。
• tsconfig.json: TypeScript 配置文件。
• tsconfig.node.json: Node.js 环境下的 TypeScript 配置文件。
• vite.config.ts: Vite 配置文件。

2. 项目的启动文件介绍

启动文件

• src/main.ts: 这是 Vue 应用的入口文件，负责初始化 Vue 应用并挂载到 DOM 上。

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

createApp(App)
  .use(router)
  .use(store)
  .mount('#app')

• src-tauri/src/main.rs: 这是 Tauri 应用的入口文件，负责启动 Rust 后端服务。

#![cfg_attr(
  all(not(debug_assertions), target_os = "windows"),
  windows_subsystem = "windows"
)]

fn main() {
  tauri::Builder::default()
    .run(tauri::generate_context!())
    .expect("error while running tauri application");
}

3. 项目的配置文件介绍

配置文件

• src-tauri/tauri.conf.json: 这是 Tauri 应用的配置文件，包含应用的基本信息、窗口配置、构建配置等。

{
  "build": {
    "distDir": "../dist",
    "devPath": "http://localhost:3000",
    "beforeDevCommand": "pnpm dev",
    "beforeBuildCommand": "pnpm build"
  },
  "ctx": {},
  "tauri": {
    "bundle": {
      "active": true,
      "targets": "all",
      "identifier": "com.example.milkywarp",
      "icon

milky-warpSimple magnifier for presentations (so that people can read the tiny texts)项目地址:https://gitcode.com/gh_mirrors/mi/milky-warp