Flutter Web环境搭建

接上篇Flutter Windows下AndroidStudio环境搭建

1、https://github.com/flutter/flutter_web 下载放到本地路径下

2、系统Path增加(根据你自己的实际用户目录修改)

 

3、flutter packages pub global activate webdev 

4、 webdev serve

 5、安装dart(不需要这一步)

https://gekorm.com/dart-windows/

下载,安装

 6、从新运行

如果提示

No pubspec.yaml file found.

请进example具体项目目录hello_world

7、执行webdev serve

Can't load Kernel binary: Invalid kernel binary format version.
No active package webdev.

网上查资料说是需要sdk自带的dart,不需要单独安装下载安装dart

8、从新配置sdk路径

系统变量Path配置:C:\flutter\bin\cache\dart-sdk\bin

9、这下成功了

 打开提示的url链接

 10、打开vscode,安装下面插件

 

 11、在lib中从新增加一个hello.dart

import 'package:flutter_web/material.dart';

//Flutter程序入口
void main() => runApp(getApp());

Widget getApp() {
  return new Container(
      child: new Text(
        "Hello World",
        style: new TextStyle(
          fontSize: 24.0,
          fontWeight: FontWeight.w900,
          fontFamily: "Georgia",
        ),
        textDirection: TextDirection.ltr,
      ),
      width: 320.0,
      height: 240.0,
      color: Colors.grey[300]);
}

12、main.dart代码修改如下

import 'package:flutter_web/material.dart';
import 'hello.dart';
void main() {
  var v=getApp();
  runApp(v);
}

13、刷新页面,运行效果

 

posted @ 2020-02-15 13:31  zhaogaojian  阅读(1136)  评论(0编辑  收藏  举报