Tauri应用开发（二）：创建第一个Tauri应用

创建tauri应用

推荐参考官方文档：https://tauri.app/v1/guides/

创建命令：

npm create tauri-app@latest

💡注意：请确保Node.js和Rust已经正确安装

在创建过程中，需要根据提示选择配置项。
主要配置有：

• 项目名称：例如my-app。

• 前端语言：可选择TypeScript / JavaScript和Rust，这里选择TypeScript / JavaScript。

• 包管理器：可选pnpm、yarn、npm，这里选择常用的npm。

• UI模板：可选Vanilla、Vue、Svelte、React、Solid、Angular，选择Vue即可。

• UI语言风格：可选TypeScript和JavaScript，任选一个即可，这里选择JavaScript。
  
  创建完成后的主要目录结构：

    ├─public						公共资源文件，例如图片、视频等静态资源
    ├─src							vue根目录
    │  ├─assets					存放Vue资源文件
    │  ├─components			    存放Vue资源文件
    │  ├─App.vue     			    Vue应用容器
    │  └─main.js                  入口
  
    └─src-tauri					tauri根目录
        ├─icons					tuari应用图标
        └─src						tauri后端跟目录，即rust目录，如果不需要使用rust开发则无需关注
  

运行应用

首先进入到my-app目录下，执行以下命令：

# 安装依赖项
npm install
# 启动应用
npm run tauri dev

💡注意：

1. 如果npm很慢，可以安装cnpm，然后执行cnpm install即可。
2. 首次执行npm run tauri dev后，会自动下载rust相关的依赖，并编译，此过程耗时比较长，预计会持续5~10分钟左右，请耐心等待。
   
   如果遇到如下错误：
   warning: spurious network error (2 tries remaining): [28] Timeout was reached (Failed to connect to github.com port 443 after 21239 ms: Timed out); class=Net (12)
   则说明网络不好，连接失败，可以多尝试几次，建议挂代理加速请求。

等待编译完成后，就可以看到应用界面啦：

哇哦，泰裤辣！

接下来就可以愉快的开发了，开发过程中如果没有涉及到和tauri后端通信，则无需关注rust部分，完全使用Vue开发即可。

提示：tauri创建的前端工程，默认使用vite，如果你更熟悉webpack，也是可以更换的。