美文网首页Android
flutter1.9 + vscode + Andorid SD

flutter1.9 + vscode + Andorid SD

作者: 云鹤道人张业斌 | 来源:发表于2020-06-11 15:52 被阅读0次

    前提

    如果已安装Git for Windows,请确保命令提示符或PowerShell中运行 git 命令,不然在后面运行flutter doctor时将出现Unable to find git in your PATH错误, 此时需要手动添加C:\Program Files\Git\bin至Path系统环境变量中

    第一步:安装flutter

    step 1

        配置镜像环境变量---让flutter命令执行更快,比如pub下载依赖

        PUB_HOSTED_URL=https://pub.flutter-io.cn

        FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

    step 2

    拉代码git  clone  https://github.com/flutter/flutter,(如:C:\src\flutter;注意,不要将flutter安装到需要一些高权限的路径如C:\Program Files\)

    在Flutter安装目录的flutter文件下找到flutter_console.bat,双击运行并启动flutter命令行,

    step3

    配置fultter环境变量,以便使用flutter命令:在path加入的路劲指向flutter文件夹的bin目录,例如:C:\flutter\bin

    接下来,你就可以在Flutter命令行运行flutter命令了

    完成以上三步就成功安装了flutter,运行flutter doctor -v 查看具体信息,会提示Andorid SDK未安装等

    第二步: vscode安装插件

      在插件市场安装flutter,dart

    第三步: java jdk 安装

       目的:执行java -version能成功展示版本号

    为了避免高版本带来的不必要影响,我这里安装 java8

    第四步: 下载Andorid SDK 

    注意:建议使用andriod studio直接批量下载(不踩坑,avd版本高且服务齐全),以下介绍权当了解配置

        我在这里下载: 这里面有  SDK Tools (Android SDK的可下载组件。它包括用于Android SDK的完整开发和调试工具集)+ SDK Platform-Tools (这是 adb, fastboot 等工具包) +  Build-Tools (这是Android开发所需的Build-Tools) + Andorid  SDK  的组合。可以在网站里下载相应的版本组合到一个文件夹,也可以使用SDK Manager 来可视化管理以上所有需要的东西

            这里我选择在网站下载一个SDK Manager

            下载上图中第二个圈圈中的,运行SDK manager.exe

    运行后查看大神的详细介绍,一路安装会发现,原本空空的platforms 文件夹有了安装sdk。也多了build-tools,platform-tools

    再来配置platform-tools和tools的环境变量,查看文件夹就能明白是为了让你能执行adb,和sdkmanager 和其他 命令

      注意android sdk环境变量需要在path后面添加\platform-tools和\tools两条路径,我的文件放在这个testjdk文件夹

    把这句;D:\testjdk\platform-tools;D:\testjdk\tools\bin添加到系统变量Path后面就行了

    在cmd命令窗口输入android -h验证环境变量是否配置成功

    ---------------以上就是全部安装内容-----------

    遇到的问题

    1.在命令提示符或PowerShell窗口中运行此命令。目前,Flutter不支持像Git Bash这样的第三方shell。

          不然会提示:SocketException: OS Error 信号灯超时时间已到,让你一脸懵逼,无法继续。

     2. windows7上 cmd指向有时候会出问题,例如尝试找git的安装目录:执行 where git  会提示where不是内部或者外部命令,而flutter需要git

    可以发现C:\Windows\System32里面搜索cmd.exe可以执行命令。将C:\Windows\System32添加到环境变量即可

    3. adb.exe 是Andriod SDK 里面用来桥接设备的,位于platform-tools文件夹内,如果配置环境变量后执行adb提示无法执行,

    也许是安装的程序过于精简没有附带共用的dll,可以尝试安装“微软常用运行库集合”。 还有可能是进程端口被占用,打开任务管理器如果有运行中的adb,右键查看是运行的文件夹,不是自己想要的就杀掉

      提示:adb.exe 0xc000007b 应用程序无法正常启动

    解决: 尝试安装 微软常用运行库合集,重启解决

    4. 证书许可 

    网上说要执行flutter doctor --android-licenses  无效,提示Unknown argument --licenses参数未知

    网上说是因为sdkmanager版本太低,尝试升级sdk  sdkmanager --update  要直到执行sdkmanager  --help里面出现 --licenses命令才算升级成功,

    解决这个问题要知道Andorid sdk目录结构。会发现sdkmanager.exe在 tools\bin 目录下。环境变量的路径要设置到bin目录,要么直接在bin目录shirft + 右键打开命令窗口。我选择添加环境变量

      但是很尴尬,我升级很多次都没有出现这--licenses命令

    3.尝试下载 tools 文件夹  看看有没有此命令

    进入下载的tools文件夹打开cmd,执行 sdkmanager --help  发现有licenses命令,替换掉我的testjdk文件夹中的整个tools文件夹。

    赶紧执行 flutter doctor -v 看看

    根据下面的提示看起来是下载的sdk指向不对,而且替换文件夹后sdk manager.exe 无法运行了(暂不影响,可以用sdkmanager --help 命令行查看可安装的进行安装)。

    此时我计划新建一个testjdk,去重新下载了一个,运行上图的SDK Manager.exe 下载所有需要的安卓sdk版本后,再替换tools文件夹,这里下载了第一个安装包。

    (其实网站里面也可以单独下载sdk,tools,build-tools等等自己去组合)

    注意改变环境变量,然后测试,会提示 Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses

    这里按照提示执行即可,一路yes就成功了

    ----------新建flutter 项目----------

    在vscode    crtl + shift + p   

    选择第一项 flutter  new project

    输入项目名

    成功

    下载夜神模拟器

      提示驱动版本过低 ---- 驱动精灵---驱动升级一个

      cd 到对应夜神模拟器 目录

    打开cmd  执行 nox_adb.exe connect 127.0.0.1:62001    (把安装目录下的bin目录路径放入环境变量)

    mumu模拟器同理 

    adb_server.exe connect 127.0.0.1:7555

    vs code打开的flutter项目就能看到右下角有了设备号

    问题: 如果adb  devices没有看到设备,链接设备容易出现灵异情况,时常连不上,多试几次吧,或者nox_adb.exe disconnect 127.0.0.1:62001 后再试

    ----------新建flutter-web 项目----------

    flutter channel 查看flutter分支

    flutter channel  beta  切换到beta分支(据说beta分支才有web支持)

    切换分之后输入flutter 报错

    没有powershell ??? windows 7 sp1 是有的,powershell 2.0

    单击“开始”、“所有程序”、“附件”和“Windows PowerShell”,然后单击“Windows PowerShell”

    Get-Host | Select-Object Version

    万能的stackoverflow 有人踩坑, 尝试下载Windows Management Framework 5.1

    stackoverflow 里面的链接下载的包要看和自己电脑匹不匹配,我的就不匹配,重启过程中提示:update 失败

    只能去查官方文档了,还是官方文档详细:我的渣渣 win7 sp1 还要先安装先决条件.NET Framework 4.5.2。 下面写的非常清楚了

    重启电脑,发现windows update成功,验证flutter,可以看到切换分支后在重新下载dart pub等

    1.安装 webdev是启动本地服务器使用: flutter pub global activate webdev

    2. 根据提示配置环境变量  C:\flutter\.pub-cache\bin  (我的flutter放在c盘)

    在C:\flutter\.pub-cache\bin 打开cmd运行webdev serve 出现错误“‘dart’ 不是内部或外部命令,也不是可运行的程序 或批处理文件。 ‘pub’ 不是内部或外部命令,也不是可运行的程序 或批处理文件。“

    配置环境变量dart-sdk。在flutter的bin目录中。C:\flutter\bin\cache\dart-sdk

    在path变量最后添加dart路径=》安装flutter存放路径\flutter\bin\cache\dart-sdk\bin

    ------首次创建新flutter-web项目(在stable分支)----------

    1.  vs code 创建项目  ctrl + shift + p    点击下拉中的flutter new  project。输入项目名即可(这样新建的项目包含android和ios,还没有web文件夹。不是我想要的)

    2. 命令行创建 web 项目需要安装另一个工具 

        执行:flutter pub global activate stagehand

    跟安装 webdev 一样 安装成功后可以执行下面命令查看帮助 flutter pub global run stagehand

    可以看到这里有7中方式建项目,我选择了web-simple (网友的第二项是:flutter-web, 私以为网友新建的项目已经配置好flutter-web依赖,我这里没有只能自己配置)

    找到一个放项目的文件夹:执行 flutter pub global run stagehand web-simple 创建项目

    根据提示执行 pub get 解析依赖包

    执行webdev serve,跑起来了。运行就在chrome打开localhost:8080即可

    3. 配置依赖,pub get 会很慢,耐心等待。。。。。

      再次webdev serve

    打包:webdev build

    ------第二次创建新flutter-web项目(在beta分支)----------

    在vs code    ctrl + shift + p  可以看到 flutter new project (还是没有看见网友的 flutter new  web  project)

    选择,输入项目名,创建成功

    或者

    flutter create myapp

    cd myapp

    由于我之前开启了web支持(flutter config --enable-web) 可以发现项目里面有web文件夹,

    根据提示,执行flutter run,可以看见有两个设备

    选择在chrome打开项目flutter run-d  chrome  提示Failed to bind web development server

    解决:点击这里查看

    flutter run -d chrome --web-port=8080 --web-hostname= the value of IPv4 Address ( ipconfig 找到IPv4 )运行成功

    打包web flutter build web 会看见生成的build文件夹,代码被编译成js

    下面探索移动端开发链接设备

    # 查看是否连接安卓设备:包括真机,或者 AVD(开发工具提供的虚拟设备)

    $ flutter devices

    # 查看可用的 AVD

    $  flutter emulators

    1 available emulator:

    Nexus_5X_API_28 • Nexus 5X • Google • Nexus 5X API 28

    # 启用 AVD,会自动打开虚拟设备,

    $ flutter emulator --launch Nexus_5X_API_28 • Nexus 5X • Google • Nexus 5X API 28

    可用的AVD,可以运行在放置安卓sdk目录的  AVD  Manager.exe 去新建

    相关文章

      网友评论

        本文标题:flutter1.9 + vscode + Andorid SD

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