内容

对 WebAssembly (Wasm) 的支持

内容

Flutter 和 Dart 支持 WebAssembly 作为构建 Web 应用时的编译目标。

要尝试使用 Wasm 构建的预构建 Flutter Web 应用，请查看 Wonderous 演示应用。

要在你自己的应用中尝试使用 Wasm，请按照以下步骤操作。

切换到 Flutter 3.24 或更高版本才能运行和编译 Flutter 应用到 WebAssembly。要确保你正在运行最新版本，请运行 flutter upgrade。

尝试默认模板示例应用，或选择任何已迁移为兼容 Wasm的 Flutter 应用。

确保你的应用的 web/index.html 已更新到最新的 Flutter 3.22 及更高版本的Flutter web 应用初始化。

如果你想使用默认设置，请删除 web/ 目录的内容，并运行以下命令重新生成它们

flutter create . --platforms web

要使用 Wasm 运行应用进行开发或测试，请在 flutter run 命令中使用 --wasm 标志。

flutter run -d chrome --wasm

要构建一个使用 Wasm 的 web 应用，请在现有的 flutter build web 命令中添加 --wasm 标志。

flutter build web --wasm

该命令将输出生成到相对于包根目录的 build/web 目录中，就像 flutter build web 一样。

即使使用了 --wasm 标志，Flutter 仍然会将应用编译成 JavaScript。如果在运行时未检测到 WasmGC 支持，则会使用 JavaScript 输出，以便应用继续在所有主要浏览器中工作。

你可以通过检查编译期间设置的 dart2wasm 环境变量来验证应用是否确实正在使用 Wasm 运行（首选）。

dart

const isRunningWithWasm = bool.fromEnvironment('dart.tool.dart2wasm');

或者，你可以使用数字表示形式的差异来测试是否使用了原生（Wasm）数字表示形式。

dart

final isRunningWithWasm = identical(double.nan, double.nan);

要运行已编译为 Wasm 的 Flutter 应用，你需要一个支持WasmGC的浏览器。

Chromium 和 V8 从 119 版本开始支持 WasmGC。iOS 上的 Chrome 使用 WebKit，它尚不支持 WasmGC。Firefox 在 Firefox 120 中宣布稳定支持 WasmGC，但目前由于已知限制而无法工作（请参阅下面的详细信息）。

为什么不支持 Firefox？ Firefox 120 及更高版本之前能够运行 Flutter/Wasm，但它们遇到了一个阻止与 Flutter 的 Wasm 渲染器兼容的错误。请关注此错误以获取详细信息。
为什么不支持 Safari？ Safari 尚未支持 WasmGC。请关注此错误以获取详细信息。

为了支持编译到 Wasm，Dart 更改了它启用与浏览器和 JavaScript API 交互的方式。这会阻止使用 dart:html 或 package:js 的 Dart 代码编译到 Wasm。

相反，Dart 现在提供了围绕静态 JS 交互构建的新型轻量级交互解决方案

要详细了解 Dart 中的 JS 交互，请参阅 Dart 的JS 交互文档页面。

除非另有说明，否则本网站上的文档反映了 Flutter 的最新稳定版本。页面最后更新于 2024-11-20。查看源代码或报告问题。

开始