本文へスキップ

プロジェクト構成

TypeScript プロジェクトでは、アプリケーションコードを app.tsx に、開発用コマンドを package.json に置きます。

#生成されるファイル

my-app/
├── resources/
│   └── icon.png
├── app.tsx
├── quickgui.config.ts
├── tsconfig.json
├── package.json
└── README.md

再利用するコンポーネントは、通常の TypeScript モジュールに置きます。ビルド成果物は .quickgui に、パッケージ済みアプリは dist に出力されます。

#アプリケーションのエントリ

app と Window は @quickgui/native から、コンポーネントと createRenderer は @quickgui/solid からインポートします。ウィンドウを開く前に app.whenReady() を待ちます。各ウィンドウは独自のレンダラーを持ち、ウィンドウが閉じると破棄されます。

#設定

import { defineConfig } from "@quickgui/cli";

export default defineConfig({
  language: "typescript",
  name: "My App",
  identifier: "com.example.my-app",
  entry: "app.tsx",
  fonts: ["assets/MyFont.ttf"],
});

アプリアイコンは resources/icon.png です。追加ファイルは resources に列挙できます。アプリアイコンとバンドルするリソースを参照してください。TOML でも同じキーを使えます。tsconfig.json では jsx を "preserve" に、jsxImportSource を "@quickgui/solid" に設定します。

#パッケージ

アプリケーションは @quickgui/native、@quickgui/solid、solid-js に依存します。@quickgui/cli は開発用の依存関係です。Terminal と updater はオプションのパッケージです。自動更新と拡張の作成を参照してください。

#ローカル開発

quickgui check
quickgui test
quickgui fmt
quickgui dev
quickgui build

check はプロジェクトの型チェックを行います。test はビルドと同じコンパイラでテストを実行します。