美文网首页
flutter web入门

flutter web入门

作者: 渣渣曦 | 来源:发表于2019-07-11 11:10 被阅读0次

1、设置以下两个PATH的环境变量

C:\flutter\.pub-cache\bin
C:\flutter\bin\cache\dart-sdk\bin

2、在VSCode的命令配置(command palette)里输入以下命令:

flutter: new web project

3、VSCode会显示以下信息:

“Stagehand needs to be installed with ‘pub global activate stagehand’ to use this feature Stagehand is a Dart project generator” 

接受自动安装或在你的终端中输入以下命令:

pub global activate stagehand

4、输入项目名称和选择路径后,‘stagehand’会生成项目。
5、项目会自动执行命令行'pub get'。加载所有依赖包。
6、执行以下命令下载web容器:

pub global activate webdev

7、使用以下命令运行web服务

webdev serve

8、打包

webdev build

9、导入图片方式
迁移文件夹 ./image 目录 至 ./web/assets/images。
在目录./web/assets/下创建AssetManifest.json,文件内容如下:

{
    "assets/*": [
        "assets/*"
    ],
    "assets/images/*": [
        "assets/images/*"
    ],
    "assets/audio/*": [
        "assets/audio/*"
    ],
    "assets/icons/*": [
        "assets/icons/*"
    ]
}

10、引入icons小图标
下载 MaterialIcons-Regular.tff 字体放在web/assets/font目录下。
在目录./web/assets/下创建FontManifest.json,文件内容如下:

[
    {
        "fonts": [
            {
                "asset": "fonts/MaterialIcons-Regular.ttf"
            }
        ],
        "family": "MaterialIcons"
    }
]

相关文章

网友评论

      本文标题:flutter web入门

      本文链接:https://www.haomeiwen.com/subject/bdrrkctx.html