<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>Tauri on KnightLiブログ</title>
        <link>https://knightli.com/ja/tags/tauri/</link>
        <description>Recent content in Tauri on KnightLiブログ</description>
        <generator>Hugo -- gohugo.io</generator>
        <language>ja</language>
        <lastBuildDate>Mon, 22 Jun 2026 08:05:45 +0800</lastBuildDate><atom:link href="https://knightli.com/ja/tags/tauri/index.xml" rel="self" type="application/rss+xml" /><item>
        <title>Pake 入門：任意の Web サイトをデスクトップアプリにする</title>
        <link>https://knightli.com/ja/2026/06/22/pake-website-to-desktop-app-guide/</link>
        <pubDate>Mon, 22 Jun 2026 08:05:45 +0800</pubDate>
        
        <guid>https://knightli.com/ja/2026/06/22/pake-website-to-desktop-app-guide/</guid>
        <description>&lt;p&gt;&lt;code&gt;tw93/Pake&lt;/code&gt; は Web サイトをデスクトップアプリとしてパッケージ化するツールです。GitHub、社内システム、個人ブログ、週報ページ、Web ツールなどを独立したウィンドウにまとめ、ブラウザのタブ混雑を減らす用途に向いています。&lt;/p&gt;
&lt;p&gt;プロジェクト：&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;https://github.com/tw93/Pake&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://github.com/tw93/Pake&lt;/a&gt;&lt;/p&gt;
&lt;h2 id=&#34;pake-cli-をインストールする&#34;&gt;Pake CLI をインストールする
&lt;/h2&gt;&lt;p&gt;README にあるコマンドです。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;pnpm install -g pake-cli
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;&lt;code&gt;pnpm&lt;/code&gt; がない場合は、先に pnpm をインストールします。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;npm install -g pnpm
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;h2 id=&#34;いちばん簡単なパッケージ化&#34;&gt;いちばん簡単なパッケージ化
&lt;/h2&gt;&lt;p&gt;GitHub をデスクトップアプリにします。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;pake https://github.com --name GitHub
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;Pake はサイトアイコンの取得を自動で試みます。まず環境が正常か確認するのに向いています。&lt;/p&gt;
&lt;h2 id=&#34;アイコンとウィンドウをカスタマイズする&#34;&gt;アイコンとウィンドウをカスタマイズする
&lt;/h2&gt;&lt;p&gt;README にはより具体的な例があります。&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;pake https://weekly.tw93.fun --name Weekly --icon https://cdn.tw93.fun/pake/weekly.icns --width &lt;span class=&#34;m&#34;&gt;1200&lt;/span&gt; --height &lt;span class=&#34;m&#34;&gt;800&lt;/span&gt; --hide-title-bar
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;よく使うパラメータは次のように理解できます。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;--name&lt;/code&gt;：アプリ名。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;--icon&lt;/code&gt;：アプリアイコン。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;--width&lt;/code&gt; / &lt;code&gt;--height&lt;/code&gt;：ウィンドウサイズ。&lt;/li&gt;
&lt;li&gt;&lt;code&gt;--hide-title-bar&lt;/code&gt;：タイトルバーを隠し、よりネイティブアプリらしく見せる。&lt;/li&gt;
&lt;/ol&gt;
&lt;h2 id=&#34;ローカル開発&#34;&gt;ローカル開発
&lt;/h2&gt;&lt;p&gt;Pake 本体を変更したい場合：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;pnpm i
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;ローカル開発：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;pnpm run dev
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;アプリをビルド：&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;div class=&#34;chroma&#34;&gt;
&lt;table class=&#34;lntable&#34;&gt;&lt;tr&gt;&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code&gt;&lt;span class=&#34;lnt&#34;&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class=&#34;lntd&#34;&gt;
&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-bash&#34; data-lang=&#34;bash&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;pnpm run build
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;h2 id=&#34;何を包むのに向いているか&#34;&gt;何を包むのに向いているか
&lt;/h2&gt;&lt;p&gt;Pake は次のような Web サイトに向いています。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;会社の内部管理画面。&lt;/li&gt;
&lt;li&gt;よく使うドキュメントサイト。&lt;/li&gt;
&lt;li&gt;Chat、監視、ダッシュボード系の Web ページ。&lt;/li&gt;
&lt;li&gt;個人的に固定して使う Web ツール。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;ログインフローが非常に複雑なサイト、ブラウザ拡張に強く依存するサイト、複数タブでの作業が頻繁なサイトにはあまり向きません。まず簡単な Web ページで試し、そのあと長期的に使うサービスをパッケージ化するとよいです。&lt;/p&gt;
</description>
        </item>
        
    </channel>
</rss>
