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