flutter web开发环境配置

首先确认你的 flutter 环境配置好了： flutter环境准备

建议使用 VS Code 开发。

web 环境配置

1 chrome支持

flutter 默认在 stable 版本的分支，如果要支持终端直接运行打开 chrome，需要切到 master 分支。

flutter channel master

2. 启用 web 配置

flutter config --enable-web

VS Code 配置

Code -> Preferences -> Extensions，分别搜索安装Flutter、Dart。

新建Web项目

在 VS Code 中，菜单 -> View -> Command Palette， 输入 flutter, 选择 Flutter: New Web Project。

Alt + F12, 在 VS Code 里打开终端，输入:

flutter create .

更新依赖：

flutter pub upgrade

运行：

flutter run -d chrome

即可在 chrome 中打开 flutter 网页。

1.9预览版有时存在网页空白的问题。遇到空白问题，可以换成用 webdev 开发，直接通过终端启动 web 服务器，在浏览器输入： 127.0.0.1:8080 访问。

激活 webdev 开发环境

github: https://github.com/dart-lang/webdev

flutter pub global activate webdev

在 .bash_profile 里添加(用户名换成你自己的)：

export PATH="$PATH:/Users/jady/flutter/.pub-cache/bin"

启动服务器

webdev serve