如何为 Flutter web 和 mobile 分别添加包？答案

【问题标题】：How to add packages separately for Flutter web and mobile?如何为 Flutter web 和 mobile 分别添加包？
【发布时间】：2020-05-25 19:14:04
【问题描述】：

我正在创建一个针对 Android/iOS 和 Web 的 Flutter 项目，有什么方法可以分别为 Flutter Mobile 和 Web 添加支持的包。例如，我在 Flutter 移动应用程序中使用 dart:io 包来保存文件，但在 Flutter web 中不支持它，所以对于 web，我使用 dart:js 包来下载 web 应用程序中的文件。

对于 C#，我们只是使用条件符号，但在 Flutter 中我找不到任何解决方案。

问题是我无法在 main.dart 文件中导入这两个包。谁能帮我实现这个目标

【问题讨论】：

您可以使用带有变量kIsWeb 的条件，然后使用正确的包。否则，您可以拆分文件以在两个文件中构建特定于平台的代码，并将可重用代码保留在当前文件中。
您可以查看此post，其中以示例进行说明。这与@Irn 在下面的回答一致。

标签： flutter dart flutter-web

【解决方案1】：

Dart 有条件导入，可以以平台库的可用性为条件。

这意味着您可以在您的包中创建一个使用dart:io 的库，以及另一个使用dart:js 的库，然后导入其中支持的任何一个。

import "file_loader.dart" // Version which just throws UnsupportedError
  if (dart.library.io) "file_loader_io.dart"
  if (dart.library.js) "file_loader_js.dart";

// Use imported API.

重要的部分是您为这些库提供相同的 API - 相同的类型具有相同的成员和相同的顶级函数 - 因此无论导入哪个库，使用的代码仍然有效。

当您编译程序时，只会使用其中一个库，因此如果其他库不正确，您将不会收到警告。您应该在所有支持的平台上测试代码，以确保这一点。

【讨论】：

【解决方案2】：

你应该分别实现代码，例如my_ui_web.dart和my_ui_mobile.dart

然后您可以使用 if: 导入这些文件：

import 'package:my_awesome_app/my_ui_mobile.dart' 
    if (dart.library.html) 'package:my_awesome_app/my_ui_web.dart' 
    as myUI;

【讨论】：