6、Flutter windows web开发环境

要是用Flutter进行web开发，首先要保证本地已有Flutter环境
Flutter要保证1.5.4以上的版本
版本检测：flutter doctor
版本升级：
flutter channel master && flutter upgrade
由于国内网络环境的原因，建议使用镜像
由于在国内安装Flutter相关的依赖可能会受到限制，Flutter官方为中国开发者搭建了临时镜像，大家可以将如下环境变量加入到用户环境变量中：
PUB_HOSTED_URL：https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL： https://storage.flutter-io.cn

安装webdev

pub global activate webdev
or
flutter packages pub global activate webdev
webdev --help

更新包
flutter pub upgrade
pub get
正式开发环境校验：
https://github.com/flutter/flutter_web
github上拉取flutter_web到本地，其中有examples目录下可以看到几个样例，控制台进入所选样例的根目录下，如Hello_wordl项目下，运行webdev serve启动本地服务，若不出问题，用浏览器打开http://localhost:8080就可以在浏览器中看到hello_world内容。
至此，证明环境OK，这个时候使用Androidstudio(懒，想要一个编译器写多平台代码，不想使用VS code)，可以按工程将改项目导入编译器，之后就跟开发移动APP一样了。
开发注意事项
flutter web跟APP开发代码部分基本上一模一样，不同的地方就是yaml文件中的依赖环境及包不同，可以自行对比。
web中dependency_overrides可替换成本地路径，就不用了再去线上拉去了（若网络环境比较差的时候）

  flutter_web:
    path: ../../flutter_web/packages/flutter_web
  flutter_web_ui:
    path: ../../flutter_web/packages/flutter_web_ui

之后项目的开发思路与APP一样只是导入的包有所不同

import 'package:flutter_web/material.dart';
import 'home/header.dart';

void main() => runApp(MaterialApp(
  title: 'Flutter Landing Page',
  debugShowCheckedModeBanner: false,
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  home: App(),
));

开始code吧（提醒一下，之前本人没有按照这种整体开发的思想写码，会发现很多时候显示不出来，必须要加上textDirection才会显示出来，嵌套Scaffold就不会了，方向确定，绘制才会有方向）