zoukankan      html  css  js  c++  java

  • 使用 VSCode 搭建 Flutter 开发环境

    概述

    编辑器使用 vscode，不再安装 Android Studio。

    安装 Git

    点击这里 下载并安装 Git

    配置 Java 环境

    下载和安装 JDK

    点击下载 Java SE Development Kit 8

    image

    我的安装路径是 “D:ProgramsJavajdk1.8.0_291”，你可以根据情况而定。

    配置环境变量

    搜索框中输入 “env” 打开 “编辑系统环境变量配置”

    image

    image

    image

    JAVA_HOME

    • 变量名：JAVA_HOME
    • 变量值：D:ProgramsJavajdk1.8.0_291

    image

    CLASSPATH

    • 变量名：CLASSPATH
    • 变量值：.;% JAVA_HOME%lib;% JAVA_HOME%lib ools.jar;

    注意：变量值的开头有个英文点。结尾有个英文分号；

    image

    添加到系统变量

    image

    image

    image

    将刚刚新建的最后一项移动到顶部：

    image

    通过点击确定将所有窗口关闭

    测试

    打开 CMD 输入 “java -version”

    image

    输入 “javac”

    image

    配置 Android 环境

    安装 Command line tools

    下载和解压

    下载 Command line tools

    image

    解压到 “D:ProtableAndroidsdk”

    注意：“D:ProtableAndroidsdk” 是我的 Android SDK 存放的路径，可以根据你的情况更改到其他位置。但是，一般将 Android SDK 放到 “Androidsdk” 目录下。

    把 D:ProtableAndroidSdkcmdline-toolsin 加入到环境变量：

    image

    注意：“D:ProtableAndroidSdkcmdline-tools” 是我的 cmdline-tools 解压后存放的路径，应改成你的位置，不过一定将 bin 目录加入到环境变量。

    command-tools

    command-tools 包含以下几个 command-tool

    image

    apkanalyzer 是一个命令行工具， 可以在构建流程完成后立即了解 APK 的组成，并且可以比较两个 APK 之间的差异。使用 apkanalyzer 可以减少调试应用中的 DEX 文件和资源相关问题所花费的时间，并减小 APK 的大小。

    avdmanager 是一个命令行工具，可以用于从命令行创建和管理 Android 虚拟设备 (AVD)。借助 AVD，您可以定义要在 Android 模拟器中模拟的 Android 手机、Wear OS 手表或 Android TV 设备的特性。

    lint 是一个命令行工具，用于代码扫描，可以帮助您识别和纠正代码的结构质量问题。

    retrace 是一个命令行工具，对于由 R8 编译的应用程序，用于从经过混淆处理的堆栈轨迹获取原始堆栈轨迹。系统会通过在映射文件中对类名和方法名与其原始定义进行匹配来重构堆栈轨迹。（对映射回原始源代码的模糊堆栈跟踪进行解码）

    sdkmanager 是一个命令行工具，允许你查看、安装、更新和卸载 Android SDK 的软件包。我们不使用 Android Studio，所以可以使用这个命令行工具管理 SDK 包。

    安装需要的 Android 环境

    在 cmd 中输入如下命令，安装需要的 Android 环境

    sdkmanager "platform-tools" "platforms;android-28" "build-tools;28.0.3"

    将 platform-tools 加入系统环境变量

    image

    debug 工具 adb（Android Debug Bridge） 就在 platform-tools 目录下，下文使用的 adb xxx 命令正是来源于此。

    使用代理

    适用于所有命令，指示使用代理

    sdkmanager --proxy=http --proxy_host=127.0.0.1 --proxy_port=1080

    --proxy={http | socks} 通过给定类型的代理连接：HTTP 或 FTP 等高级协议的 http，或 SOCKS（V4 或 V5）代理的 socks。

    也可以在用户目录下～/.android 创建 androidtool.cfg 文件：

    http.proxyPort=1080
http.proxyHost=127.0.0.1

    配置安卓环境变量

    ANDROID_HOME

    • 变量名：ANDROID_HOME
    • 变量值：D:ProtableAndroid

    image

    ANDROID_SDK_ROOT

    • 变量名：ANDROID_SDK_ROOT
    • 变量值：D:ProtableAndroidSdk

    注意：这里选择的是 Sdk 目录，和 ANDROID_HOME 的变量值不同

    image

    下载和安装 Flutter SDK

    配置 Flutter 国内镜像

    在任意位置右键 “Git bash here”

    image

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

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

    Flutter SDK

    下载 Flutter SDK

    点击这里 查看 Flutter SDK 列表，并下载

    image

    解压到 D:Protableflutter

    image

    注意：“D:Protableflutter 是我的 Flutter SDK 存放的路径，可以根据你的情况更改到其他位置。

    配置 Flutter SDK 环境变量

    image

    打开 cmd 输入 “flutter” 检测环境变量：

    image

    接受许可协议

    在 cmd 中输入如下命令，并在交互式 “对话” 中全部回复 “y”

    flutter doctor --android-licenses

    检测 flutter 开发环境

    在 cmd 中输入如下命令：

    flutter doctor

    image

    配置 VSCode

    点击这里 下载并安装 VSCode

    image

    在插件中搜索 Flutter 并安装

    image

    创建 Flutter 项目

    通过 ctrl + shift + p 打开命框，输入 “flutter” 并选择 “New Application Project”

    image

    输入项目名称按下回车即可创建项目

    image

    调试

    使用浏览器调试

    注意右下角状态栏，你也可以通过点击此处切换到 Edge Chromium

    image

    按下 f5 并选择 “Dart&Flutter”

    image

    稍等片刻即可自动打开 Chrome

    image

    使用真机调试

    首先需要进入 “开发者选项” 将手机的 “允许 USB 调试” 打开，使用数据线连接电脑，同意 USB 调试。在 CMD 中输入如下命令，设置 wifi 连接的端口号为 5555

    adb tcpip 5555

    在 CMD 中输入如下命令，链接手机。你的手机的 IP 地址一般在 设置 > wifi > 高级设置 中查看。比如 IP 为：x.x.x.x

    adb connected to x.x.x.x:5555

    在启动应用之前，注意此时 VSCode 中右下角的状态栏中显示的应是通过 USB 链接的手机型号

    image

    按下 f5 并选择 “Dart&Flutter”。稍等片刻会在手机中弹出安装提示，同意即可。

    使用模拟器调试

    使用模拟器调试，Windows 需要打开 Hyper-V 服务，并在 BIOS （电脑主板设置）中启用 VT（虚拟化技术）。

    安装 Intel HAXM

    Intel HAXM （Hardware Accelerated Execution Manager），即英特尔硬件加速执行管理器 （Intel HAXM） 是一款硬件辅助虚拟引擎 （管理程序） 使用基于 Intel (R) Virtualization Technology （VT） 的硬件加速， 因此需要 CPU 支持 VT ， 而且仅限于 Intel CPU。Intel HAXM 与英特尔 Android x86 模拟器映像及官方 Android SDK 管理器结合使用，HAXM 可在支持英特尔虚拟化技术的系统上加快 Android 模拟器的速度。

    sdkmanager "extras;intel;Hardware_Accelerated_Execution_Manager"

    验证 Intel HAXM

    打开 CMD 输入如下命令验证 Intel HAXM

    sc query intelhaxm

    image

    如果出现问题，比如 “The specified service does not exist as an installed service”，打开 “D:ProtableAndroidSdkextrasintelHardware_Accelerated_Execution_Manager” 目录，通过 silent_install.bat 进行安装

    image

    安装安卓系统镜像

    sdkmanager --install "system-images;android-29;default;x86"

    安装模拟器

    sdkmanager "emulator"

    将 emulator 添加到环境变量

    image

    创建一个安卓模拟器实例

    创建一个名为 “test” 的模拟器实例，后续指令可能需要在 Android/emulator 目录下执行，或者将其加入环境变量

    echo "no" | avdmanager --verbose create avd --force --name "test" --package "system-images;android-29;default;x86" --tag "default" --abi "x86"

    启动安卓模拟器

    emulator @test &

    按下 f5 并选择 “Dart&Flutter”。稍等片刻会在模拟器中显示 Flutter 应用

    image

    使用第三方模拟器调试

    以逍遥模拟器为例，并不需要再做什么配置，只需要打开模拟器，在 VSCode 右下角状态栏中显示如下设备

    image

    按下 f5 并选择 “Dart&Flutter”。稍等片刻会在模拟器中显示 Flutter 应用

    image

    也可以通过 adb 链接模拟器 IP 地址，比如：

    • 夜神模拟器 adb connect 127.0.0.1:62001
    • MuMu 模拟器 adb connect 127.0.0.1:7555

    参考资料
  • 相关阅读:
    jquery实现动态五角星评分
    jquery实现动态五角星评分
    三个水桶（看了三遍，想了五遍!）
    三个水桶（看了三遍，想了五遍!）
    三个水桶（看了三遍，想了五遍!）
    复制一个5G文件只需要两秒，全网最牛方法！
    复制一个5G文件只需要两秒，全网最牛方法！
    Symmetric Multiprocessor Organization
    smaller programs should improve performance RISC(精简指令集计算机)和CISC(复杂指令集计算机)是当前CPU的两种架构 区别示例
    mysqli_multi_query($link, $sql_w);
  • 原文地址：https://www.cnblogs.com/guangzan/p/15032860.html
Copyright © 2011-2022 走看看