如何解决 Flutter for Web 中的 Web 开发服务器错误？答案

【问题标题】：how to solve with a web dev server error in flutter for web?如何解决 Flutter for Web 中的 Web 开发服务器错误？
【发布时间】：2019-11-13 20:12:54
【问题描述】：

[编辑] 如果我在我的项目中运行 webdev serve 就会出现

[WARNING] Throwing away cached asset graph because the build phases have changed. This most commonly would happen as a result of adding a new dependency or updating your dependencies.
[INFO] Cleaning up outputs from previous builds. completed, took 6.6s
[INFO] Building new asset graph completed, took 16.7s
[INFO] Checking for unexpected pre-existing outputs. completed, took 3ms
[INFO] Serving `web` on http://127.0.0.1:8080
[WARNING]build_web_compilers:entrypoint on web/main.dart: Skipping compiling retgoo_internal|web/main.dart with ddc because some of its
transitive libraries have sdk dependencies that not supported on this platform:

retgoo_internal|lib/protocol/http_non.dart

https://github.com/dart-lang/build/blob/master/docs/faq.md#how-can-i-resolve-skipped-compiling-warnings

[INFO] Running build completed, took 19.0s
[INFO] Caching finalized dependency graph completed, took 473ms
[INFO] Succeeded after 19.5s with 634 outputs (3522 actions)

但是当我尝试在浏览器中打开时，只会出现一个空白页面，当我尝试开始调试时，只会启动并且也会出现一个空白页面。发射并没有停止。 build.yaml 文件中有警告的教程，但是当我搜索很多 build.yaml 文件时...我应该修复哪个文件？

【问题讨论】：

也许这个答案会对你有所帮助。 stackoverflow.com/a/56818422/1737201
@mezone 是一样的，但是端口不一样，比如 port:8082
如果我使用端口：5416 成功，但在浏览器中出现“找不到 retgoo_internal/index.html 或 retgoo_internal 中的任何文件。”
编辑问题后，它看起来完全不同。现在这是一个完全不同的问题。

标签： flutter dart flutter-web

【解决方案1】：

在您的 wanrnig 消息中明确指出，由于某些传递 sdk 依赖关系，main.dart 未编译。

[警告]build_web_compilers：web/main.dart 上的入口点：跳过使用 ddc 编译 retgoo_internal|web/main.dart，因为它的一些传递库具有此平台不支持的 sdk 依赖项：

retgoo_internal|lib/protocol/http_non.dart

这仅仅意味着你的 Flutter 相关的 dart 代码都没有被编译成 javascript。据我所知，flutter-web 是这样做的。

它将你使用flutter框架编写的dart代码编译成javascript。
这意味着 main.dart 和其他 dart 文件编译成 main.dart.js 和其他 chunks.js 文件。
然后在 web/index.html 中加载这个 javascript 文件，该文件进一步创建和处理要在您的页面中呈现的新 dom 元素。类似由 react 或 angular 创建的单页应用程序。

一旦您修复了 pubspec.yaml 中的传递依赖项，这些依赖项可能由您添加为依赖项的任何其他库引入，此问题将得到解决。

由于 flutter-web 不支持任何插件，但必须手动完成，方法是拉取您希望包含的插件的源代码，放置在源目录中，并将其中的导入语句从 package:flutter/ 更改为包：flutter_web。这不是微不足道的，但仍然可以实现。

【讨论】：