flutter web打包


Flutter Web 打包指南

// 如果你的Flutter版本低於2.0,請先升級Flutter版本
// 創建一個web文件夾來存放web相關的資源
flutter create .

// 使用HTML渲染器打包,該渲染器提供的打開速度最快,並且具有良好的瀏覽器兼容性(例如IE, Chrome, Safari等)
flutter build web --web-renderer html

// 使用默認設置進行打包,提供的打開速度為一般,但依然保持良好的瀏覽器兼容性
flutter build web

// 使用CanvasKit渲染器進行打包,雖然打開速度是最慢的,但依然具有良好的瀏覽器兼容性
flutter build web --web-renderer canvaskit

常見問題及解決方法

// 問題1: 打開index.html時,頁面顯示為空白
// 這是一個正常現象。Flutter Web的行為不同於傳統的前端web開發,它不支持直接點擊index.html文件進行訪問。
// 你必須將其部署到一個服務器容器中,例如tomcat。

// 問題2: 盡管已經部署到tomcat,但通過瀏覽器打開仍然是空白頁面
// 這通常是因為文件路徑引用不正確所致。有兩種解決方法:

// 方法1: 修改index.html中的<base href="/">為<base href="">
用編輯器打開index.html,能看到源文件,把<base href="/">,改成<base href="">

// 方法2: 將<base href="/">修改為你的服務器路徑
// 例如:<base href="http://192.168.1.80:3350/web/">
用編輯器打開index.html,能看到源文件,把<base href="/">,改成<base href="http://192.168.1.80:3350/web/">


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM