Package Flutter windows app

更新於 發佈於 閱讀時間約 5 分鐘

msix

After comparing different methods, I think the most stable way is using msix to package the windows desktop app.

raw-image

Installation

flutter pub add --dev msix

self-signed certificate

To create an installer for your desktop app project, you need a certificate for your app. Let’s use OpenSSL to create one.

download

https://slproweb.com/products/Win32OpenSSL.html

After downloading and installing OpenSSL, add path-to-OpenSSL-Win64\bin to your environment variable.

create certificate

Run the following commands step by step then you can obtain the certificate.

$ openssl genrsa -out mykeyname.key 2048
$ openssl req -new -key mykeyname.key -out mycsrname.csr
$ openssl x509 -in mycsrname.csr -out mycrtname.crt -req -signkey mykeyname.key
$ openssl pkcs12 -export -out CERTIFICATE.pfx -inkey mykeyname.key -in mycrtname.crt

msix_config

Let’s add the msix settings in pubspec.yaml .

The most important part are the certificate_path and certificate_password .

Pakage app

flutter pub run msix:create
raw-image

It would take a while to package the project. Then you would obtain a msix file, this is the installer of the app.

Trusted Root Certification Authorities

Before using this installer to install your app, you need to add the certificate of this installer into the Trusted Root Certification Authorities of your pc. Since you use a self-signed certificate, windows don’t trust it by default.

choose Properties

raw-image

choose Digital Signatures

raw-image

choose your certificate then choose Details

raw-image

click Install Certificate… to install

raw-image

choose Local Machine

raw-image

choose Trusted Root Certification Authorities

raw-image
raw-image

Finally, click ok and ok. Then you should be able to use this installer.

留言
avatar-img
留言分享你的想法!
avatar-img
張哲嘉的沙龍
9會員
49內容數
比起詳細教學單一技能,網路上或者市面上整合多項技能的教學相對少很多,但要真的完成一項專案往往不是只靠一項技能便能做到。 而且教科書式的完整教學也比較枯燥乏味,因此我想以自身的經驗為例,以全端開發各項技能中最常用到的部分進行講解,讓讀者能夠快速上手掌握全端技能。
張哲嘉的沙龍的其他內容
2023/01/09
最近想把我的 Switch OLED 帶出門,在挑什麼 Switch 攜帶包比較好,看很多人都推薦 tomtoc,感覺評價挺不錯的,最後決定入手 tomtoc 的玩家首選旅行包 以 Switch OLED 來說有三種選擇...... https://zjzhang.org/post/nintendo
2023/01/09
最近想把我的 Switch OLED 帶出門,在挑什麼 Switch 攜帶包比較好,看很多人都推薦 tomtoc,感覺評價挺不錯的,最後決定入手 tomtoc 的玩家首選旅行包 以 Switch OLED 來說有三種選擇...... https://zjzhang.org/post/nintendo
2022/12/14
Cache categories There are two kinds of cache, one is the read-only cache, and the other one is the read-and-write cache.
2022/12/14
Cache categories There are two kinds of cache, one is the read-only cache, and the other one is the read-and-write cache.
2022/10/13
最近在把 Tailwind CSS 加入我的技能樹中,其實像這種 Bootstrap, Tailwind CSS 都是很基本前端需要掌握的 CSS 相關工具 但是我其實對美工比較沒那麼大的興趣,我對功能、效能、安全比較感興趣,所以後端、架站、DevOps、一些安全防護玩了一圈,現在來加強我的排版功力
2022/10/13
最近在把 Tailwind CSS 加入我的技能樹中,其實像這種 Bootstrap, Tailwind CSS 都是很基本前端需要掌握的 CSS 相關工具 但是我其實對美工比較沒那麼大的興趣,我對功能、效能、安全比較感興趣,所以後端、架站、DevOps、一些安全防護玩了一圈,現在來加強我的排版功力
看更多
你可能也想看
Thumbnail
孩子寫功課時瞇眼?小心近視!這款喜光全光譜TIONE⁺光健康智慧檯燈,獲眼科院長推薦,網路好評不斷!全光譜LED、180cm大照明範圍、5段亮度及色溫調整、350度萬向旋轉,讓孩子學習更舒適、保護眼睛!
Thumbnail
孩子寫功課時瞇眼?小心近視!這款喜光全光譜TIONE⁺光健康智慧檯燈,獲眼科院長推薦,網路好評不斷!全光譜LED、180cm大照明範圍、5段亮度及色溫調整、350度萬向旋轉,讓孩子學習更舒適、保護眼睛!
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
這篇文章將會提供在伺服器上安裝憑證的步驟,包括下載憑證,設定php.ini以及重新啟動Web Server等。
Thumbnail
這篇文章將會提供在伺服器上安裝憑證的步驟,包括下載憑證,設定php.ini以及重新啟動Web Server等。
Thumbnail
本文教你如何在配備 M1 晶片的 MacBook Air 上安裝Flutter,以同時開發Android和iOS apps。
Thumbnail
本文教你如何在配備 M1 晶片的 MacBook Air 上安裝Flutter,以同時開發Android和iOS apps。
Thumbnail
之前因為常需要跑devops相關工具,因此開發環境完全是用Ubuntu的圖形化介面,但偶爾會遇到一些延遲以及小bug,偶然的機會下發現在windows設定git-bash似乎也能達到一樣的效果,也能順便增加對windows開發人員生態系的了解,因此本篇主要是針對如何設定美麗的terminal以及vs
Thumbnail
之前因為常需要跑devops相關工具,因此開發環境完全是用Ubuntu的圖形化介面,但偶爾會遇到一些延遲以及小bug,偶然的機會下發現在windows設定git-bash似乎也能達到一樣的效果,也能順便增加對windows開發人員生態系的了解,因此本篇主要是針對如何設定美麗的terminal以及vs
Thumbnail
打包網頁 在部署網站之前,我們要先來打包我們的網頁前端專案 為什麼要打包呢?什麼是打包呢?這有點像是編譯,如果你寫過 C 應該講到這裡就理解為什麼要這樣做了 在網頁開發中網頁內容最原始就是直接用 html 下去寫,但一個成熟的開發者會善用框架來開發,不論是用 vue 或 react,樣式的部分也會從
Thumbnail
打包網頁 在部署網站之前,我們要先來打包我們的網頁前端專案 為什麼要打包呢?什麼是打包呢?這有點像是編譯,如果你寫過 C 應該講到這裡就理解為什麼要這樣做了 在網頁開發中網頁內容最原始就是直接用 html 下去寫,但一個成熟的開發者會善用框架來開發,不論是用 vue 或 react,樣式的部分也會從
Thumbnail
I’m sure that I would forget it again after a few months, so let’s take note of it. Installation We need to use homebrew to install certbot. renew
Thumbnail
I’m sure that I would forget it again after a few months, so let’s take note of it. Installation We need to use homebrew to install certbot. renew
Thumbnail
msix After comparing different methods, I think the most stable way is using msix to package the windows desktop app. Installation download
Thumbnail
msix After comparing different methods, I think the most stable way is using msix to package the windows desktop app. Installation download
Thumbnail
Error: wamp解法: 1. 下載cacert.pem 到這邊下載: https://curl.se/docs/caextract.html 2. 將檔案放到ssl folder 路徑類似這樣,放在自己使用的php版本下: 3. 在php.ini中加入cacert.pem的path
Thumbnail
Error: wamp解法: 1. 下載cacert.pem 到這邊下載: https://curl.se/docs/caextract.html 2. 將檔案放到ssl folder 路徑類似這樣,放在自己使用的php版本下: 3. 在php.ini中加入cacert.pem的path
Thumbnail
說明如何在Windows系統中安裝 Flutter 與 Visual Studio Code 的開發環境
Thumbnail
說明如何在Windows系統中安裝 Flutter 與 Visual Studio Code 的開發環境
Thumbnail
說明如何在Linux系統中安裝 Flutter 與 Visual Studio Code 開發環境
Thumbnail
說明如何在Linux系統中安裝 Flutter 與 Visual Studio Code 開發環境
Thumbnail
操作筆記、安裝git、下載github專案
Thumbnail
操作筆記、安裝git、下載github專案
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News