Set up web development for Flutter from Android on Linux start
To add web as a Flutter app target for Linux with Android, follow this procedure.
Configure Chrome as the web DevTools tools
#-
Allocate a minimum of 1 GB of storage for Google Chrome. Consider allocating 2 GB of storage for an optimal configuration.
-
Download and install the Linux version of Google Chrome to debug JavaScript code for web apps.
How to install Chrome from the command line
wget https://dl-ssl.google.com/linux/linux_signing_key.pub -O /tmp/google.pub
gpg --no-default-keyring \
--keyring /etc/apt/keyrings/google-chrome.gpg \
--import /tmp/google.pub
echo 'deb [arch=amd64 signed-by=/etc/apt/keyrings/google-chrome.gpg] http://dl.google.com/linux/chrome/deb/ stable main' | sudo tee /etc/apt/sources.list.d/google-chrome.list
sudo apt-get update -y; sudo apt-get install -y google-chrome-stable
检查你的开发配置
#运行 Flutter doctor
#flutter doctor
指令将检查 Linux 完整的
Flutter 开发环境的所有组件。
-
Open 一个 shell.
打开一个 shell。
-
要检查所有组件的安装情况,请运行以下指令。
flutter doctor
由于你选择为 Web 进行开发,因此不需要 所有 组件。如果你遵循本指南,指令结果应该类似于:
Running flutter doctor...
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.24.3, on Ubuntu 20.04 (LTS), locale en)
[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2024.1)
[✓] Linux toolchain - develop for Linux desktop
[✓] VS Code (version 1.93)
[✓] Connected device (1 available)
[✓] Network resources
∙ No issues found!
解决 Flutter doctor 的问题
#当 flutter doctor
指令返回错误时,可能是 Flutter、VS Code、one of the Linux libraries、连接的设备或者网络资源出错。
如果 flutter doctor
指令返回这些组件中的任何一个错误,请使用 verbose 标志再次运行。
flutter doctor -v
查看输出结果,了解可能需要安装的其他软件或者需要执行的其他任务。
如果你更改了 Flutter SDK 或其他相关组件的配置,请 再次运行 flutter doctor
来检查安装。
开始使用 Flutter 开发 Web on Linux 应用
#恭喜你。 在安装完成所有必要条件和 Flutter SDK 后,你就可以开始开发适用于 Web on Linux 的 Flutter 应用了。
如果你要继续学习之旅,请参考以下指南:
除非另有说明,本文档之所提及适用于 Flutter 的最新稳定版本,本页面最后更新时间: 2024-04-12。 查看文档源码 或者 为本页面内容提出建议。