Qwik

本指南将引导你使用 Qwik Web 框架创建 Tauri 应用。在 https://qwik.dev 了解有关 Qwik 的更多信息。

¥This guide will walk you through creating your Tauri app using the Qwik web framework. Learn more about Qwik at https://qwik.dev.

检查清单

¥Checklist

• 使用 SSG。Tauri 不支持基于服务器的解决方案。

  ¥Use SSG. Tauri doesn’t support server-based solutions.

• 在 tauri.conf.json 中将 dist/ 用作 frontendDist。

  ¥Use dist/ as frontendDist in tauri.conf.json.

示例配置

¥Example Configuration

1. Create a new Qwik app

   npm

   npm create qwik@latest
   cd <PROJECT>

   yarn

   yarn create qwik@latest
   cd <PROJECT>

   pnpm

   pnpm create qwik@latest
   cd <PROJECT>

   deno

   deno run -A npm:create-qwik@latest
   cd <PROJECT>

2. Install the static adapter

   npm

   npm run qwik add static

   yarn

   yarn qwik add static

   pnpm

   pnpm qwik add static

   deno

   deno task qwik add static

3. Add the Tauri CLI to your project

   npm

   npm install -D @tauri-apps/cli@latest

   yarn

   yarn add -D @tauri-apps/cli@latest

   pnpm

   pnpm add -D @tauri-apps/cli@latest

   deno

   deno add -D npm:@tauri-apps/cli@latest

4. Initiate a new Tauri project

   npm

   npm run tauri init

   yarn

   yarn tauri init

   pnpm

   pnpm tauri init

   deno

   deno task tauri init

5. Tauri configuration

   npm

   tauri.conf.json

   {
     "build": {
       "devUrl": "http://localhost:5173"
       "frontendDist": "../dist",
       "beforeDevCommand": "npm run dev",
       "beforeBuildCommand": "npm run build"
     }
   }

   yarn

   tauri.conf.json

   {
     "build": {
       "devUrl": "http://localhost:5173"
       "frontendDist": "../dist",
       "beforeDevCommand": "yarn dev",
       "beforeBuildCommand": "yarn build"
     }
   }

   pnpm

   tauri.conf.json

   {
     "build": {
       "devUrl": "http://localhost:5173"
       "frontendDist": "../dist",
       "beforeDevCommand": "pnpm dev",
       "beforeBuildCommand": "pnpm build"
     }
   }

   deno

   tauri.conf.json

   {
     "build": {
       "devUrl": "http://localhost:5173"
       "frontendDist": "../dist",
       "beforeDevCommand": "deno task dev",
       "beforeBuildCommand": "deno task build"
     }
   }

6. Start your tauri app

   npm

   npm run tauri dev

   yarn

   yarn tauri dev

   pnpm

   pnpm tauri dev

   deno

   deno task tauri dev