原文

https://srihari-sundaramurugan.medium.com/setting-up-flutter-development-environment-for-windows-vs-code-93820f4caa57

正文

作为一个开发人员,我一直想尝试 flutter 已经很久了。当我开始使用 Flutter 时,设置它花费了我大量的时间,我不得不通过各种教程和文章来设置开发环境。我写这篇博客是因为我不想让我的开发同事们在这个过程中面对我不得不面对的错误。

系统要求:

要安装和运行 Flutter,您的开发环境必须满足以下最低要求:

  • Operating Systems 操作系统: Windows 7 SP1 或更高版本(64 位) ,基于 x86-64
  • Disk Space 磁盘空间: 1.64 GB (不包括 IDE/工具的磁盘空间)
  • Tools 工具 : Flutter 取决于这些工具在您的环境中是否可用
  • Windows PowerShell 5.0 or newer (this is pre-installed with Windows 10) 或更新(这是预装 Windows 10)
  • Git for Windows 适用于 Windows 的 Git 2. x, with the 2. x,加上Use Git from the Windows Command Prompt 使用命令提示符的 Git option. 选择
  • 如果已经安装了 Git for Windows,请确保您可以运行git 命令来自命令提示符或 PowerShell

需要下载/安装的东西:

以下是您在此过程中将要下载/安装的内容:

  • Flutter Flutter SDK

软件开发软件开发工具包

  • Andriod Studio
  • Java SE Development Kit 开发工具包
  • Git 饭桶for windows 为了窗户
  • VS Code VS 代码 (Visual Studio Code)

我们开始吧?

Flutter SDK (软件开发工具包) :

A clip from 一个剪辑自https://flutter.dev/docs/get-started/install/windows

您可以从正式的 Flutter 安装文档中下载 Flutter SDK 的最新稳定版本。目前 windows 的稳定版本是 2.2.3-stable,当你阅读这篇博客时可能会有所不同。下载当时可用的最新版本。

  • . zip 中提取 Flutter SDK
  • 在你的 c 盘中创建一个文件夹C:\src 并粘贴提取的 Flutter SDK

C 驱动下的 Flutter SDK

  • 现在进入 Flutter 文件夹,然后进入垃圾箱
  • 复制垃圾桶的路径
  • 打开窗口搜索并键入env.
  • 现在打开“编辑环境变量为您的帐户”
  • 双击path
  • Click 点击New 并粘贴的路径flutter\bin 然后按「确定」
  • 现在,打开 cmd (或任何终端窗口)并输入以下命令

dart where flutter dart

如果您得到了 Flutter 和省道文件的位置,您已经成功地安装了 Flutter SDK 并设置了它的路径。

Java SE 开发工具包:

如果您的 pc 上已经安装了 JDK,请确保将其设置为“ JAVA.home”路径。

现在,让我们设置 java se:

  • Download “Java SE 8” from 从网站下载「 javase8」JDK SE 8 DOWNLOAD 8 DOWNLOAD.
  • Under “Java SE Development Kit 8u301”, you’ll see this 在“ javase 开发工具包 8u301”下,您将看到这个

https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html

  • 下载并安装 x64/x86 w.r.t. 您的 PC 的规范
  • 安装后,导航到 \bin : 在我的案例中:

dart C:Program FilesJavajdk1.8.0_301bin

  • 复制路径,打开“编辑环境变量为您的帐户”
  • 创建一个新变量JAVA_HOME .

JAVA_HOME Environment Variable 环境变量

您已经完成了 JDK 的设置

Andriod Studio:

我们正在下载 andriod studio 来建立 andriod 模拟器。

  • 下载 Andriod StudioANDRIOD STUDIO.
  • Install it. 安装它
  • 现在,打开 CMD/Terminal,运行以下命令:

dart flutter doctor

你可能不会得到绿蜱的一切,检查只有 andriod 工作室,因为现在。

  • 如果 Flutter 找不到它,就跑 flutter config --android-studio-dir <directory> 设置 Android Studio 安装的目录
  • 打开 Andriod Studio

如果你想在 Andriod Studio 开发应用程序,

- Go to plugins, search for “Dart” and “Flutter”.

- 下载它们,并重新启动 andriod studio。现在你可以在仪表板上看到一个“创建新的 Flutter 项目”。

  • Select 选择 More Actions.

Andriod Studio

  • Choose 选择AVD Manager .

AVD Manager — Andriod Studio

  • Click 点击+ Create Virtual Device… .

Create Virtual Device — AVD Manager — Andriod Studio

  • 选择一个你喜欢的 Andriod 设备,然后点击下一步

Create Virtual Device — AVD Manager — Andriod Studio

  • 点击下载你想要的 Andriod 版本Download (blue), under (蓝色) ,在下面Release Name .
  • 一旦下载完毕,点击下一步

Create Virtual Device — AVD Manager — Andriod Studio

  • Now, Finish. 现在,完成

🍻Cheers to you, you’re almost done!. 🥳

为你干杯,你就快完成了

Visual Studio 代码:

向我最喜欢的 IDE 问好!

Extensions — VS Code

  • Search for 搜寻Flutter in the extensions, and install this: 然后安装这个:

VS Code Flutter 扩展

好了,一切都结束了。现在,是时候给心房 Flutter 医生做检查了。

  • 打开 CMD/终端,然后运行

dart flutter doctor

  • 您可能仍然有一个未检查的框

Flutter Doctor Flutter

  • 在你的终端上运行这个命令,

dart flutter doctor \--andriod-licenses

  • Now, run 现在,跑吧flutter doctor again. 再一次

Flutter Doctor Flutter

Yipieee,现在你已经准备好开发 Flutter 应用程序了。

写博客会让我感到快乐,并鼓励我写更多这样的博客。


© 猫哥

往期

开源

GetX Quick Start

https://github.com/ducafecat/getx_quick_start

新闻客户端

https://github.com/ducafecat/flutter_learn_news

strapi 手册译文

https://getstrapi.cn

微信讨论群 ducafecat

系列集合

译文

https://ducafecat.tech/categories/%E8%AF%91%E6%96%87/

开源项目

https://ducafecat.tech/categories/%E5%BC%80%E6%BA%90/

Dart 编程语言基础

https://space.bilibili.com/404904528/channel/detail?cid=111585

Flutter 零基础入门

https://space.bilibili.com/404904528/channel/detail?cid=123470

Flutter 实战从零开始 新闻客户端

https://space.bilibili.com/404904528/channel/detail?cid=106755

Flutter 组件开发

https://space.bilibili.com/404904528/channel/detail?cid=144262

Flutter Bloc

https://space.bilibili.com/404904528/channel/detail?cid=177519

Flutter Getx4

https://space.bilibili.com/404904528/channel/detail?cid=177514

Docker Yapi

https://space.bilibili.com/404904528/channel/detail?cid=130578