Flutter + Idea 环境搭建及配置教程

目录
  • 安装Flutter SDK
  • 安装flutter
  • 下载SDK Manager Tools
  • 下载需要的平台及工具
  • 配置环境变量
  • 安装Dart和Flutter插件
  • 下载需要的系统镜像

最近正式入坑Flutter,首先从环境搭建开始,看了网上好多关于Windows环境搭建的资料,基本都是按官方文档写的,看完的感受是,还不如直接去看官方文档。

英文文档传送门:Get Started: Install on Windows

中文文档传送门:Get Started: Install on Windows

本文主要总结我实际搭建的过程,最后发现不一定按网上那些博客或者官方文档写的来也可以搭建成功。

总的来说需要的也就4样东西,找齐了配置一下就OK;

(1)Flutter SDK (建议下载官网的,下载完直接能用)配置环境

(2)准备ide(Android Studio或者IntelliJ IDEA)配置flutter的SDK即可 建议使用 Android Studio 会少些麻烦

(3)下载Dart插件

(4)下载Flutter插件

(5) 解决问题

安装Flutter SDK

首先下载官方文档中 flutter_windows_v2.5.1 压缩包(如下图红框中所示),解压到自己指定的位置,解压完文件夹名称叫做flutter,这就是Flutter SDK了(后面再ide中配置的时候需要)。同时在系统path中添加flutter中bin所在的路径
注意,不要将flutter安装到需要一些高权限的路径如C:\Program Files\)

安装flutter

在刚下载的flutter目录下找到flutter_console.bat文件,双击可运行文件,(这里网上有好几种方法进行flutter的安装,比如说打开运行,输入powerShell,然后运行flutter doctor,我试过都有问题,还是用官网的这种方法最靠谱),然后输入指令:flutter doctor,即可自动安装,这个是官网推荐的方法,很靠谱。但是由于我们的国策,使用上面那种方法会一直处于以下的界面:

最后直接显示超时:

所以,我们使用国内镜像的地址去下载: 在输入flutter docter之前输入以下两句:

1)命令行输入第一条: set PUB_HOSTED_URL=https://pub.flutter-io.cn

2)命令行输入第二条:set FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

3)再次输入flutter doctor 命令即可执行成功

以上完美解决:Got socket error trying to find package mockito at https://pub.dartlang.org.这个问题。


出现这个安装成功。

如果出现下面这个问题请按照下面步骤修复,主要是因为 我们使用的是 Idea 没有使用 Android Studio 没有安装 Android sdk 需要手动安装配置

下载SDK Manager Tools

这里下载,在官网下拉,在Command line tools only里下载对应平台的sdkManager;

下载后解压得到文件夹 cmdline-tools, 我们的Android sdk放在 D:\Android\sdk下,解压后的目录最好放在F:\Android\sdk\cmdline-tools\latest里,否则当执行sdkmanager时会报错

执行一下sdkmanager --list命令

没有报错,命令成功执行
原因分析及解决方法来源:https://stackoverflow.com/questions/65262340/cmdline-tools-could-not-determine-sdk-root

下载需要的平台及工具

执行sdkmanager “platform-tools” “platforms;android-29”
下载需要的平台及工具,我准备的android系统是10 ,对应平台为29

输入y同意许可,等待下载完成

检查一下sdk目录发生了变化

执行命令sdkmanager “build-tools;28.0.3”,下载build-tools,


先执行一下 flutter config --android-sdk F:\Android\sdk,指定一下android sdk路径,在执行 flutter doctor --android-licenses 来修复许可

一路填 y,知道执行完毕

再次执行flutter doctor命令

配置环境变量

新建环境变量ANDRIOD_HOME,值为SDK安装目录,如F:\Android\sdk

配置环境变量Path,加入%ANDROID_HOME%\tools,%ANDROID_HOME%\platform-tools和%ANDROID_HOME%\build-tools

至此,flutter 和 android sdk的配置已经进行完毕

安装Dart和Flutter插件

(1)Flutter需要如下两个插件的支持:
Flutter 插件用来支撑Flutter开发者的流程(运行,调试,热加载,等等)
Dart插件则提供代码分析(代码合法性校验,代码补全等等)
(2)然后在Androidstudio或者IntelliJ IDEA 中下载Dart插件,假如下不了,那就是没有进行科学上网的原因,也可以通过科学上网访问下面的链接进行下载。假如是自己通过如下链接下载的,则把下载后的zip包解压后将整个文件夹复制到你使用的ide的plugins文件夹中(整个文件夹拷贝到plugins下即可)。

https://plugins.jetbrains.com/pluginManager/?action=download&id=Dart&build=IU-172.3757.52&uuid=076050b4-d279-493c-945e-5fb3ff2af32e

(3)然后在Androidstudio或者IntelliJ IDEA 中下载flutter-intellij插件,假如下不了,那就是没有进行科学上网的原因,也可以通过科学上网访问下面的链接进行下载。假如是自己通过如下链接下载的,则把下载后的zip包解压后将整个文件夹复制到你使用的ide的plugins文件夹中(整个文件夹拷贝到plugins下即可)。

https://plugins.jetbrains.com/pluginManager/?action=download&id=io.flutter&build=IU-172.3757.52&uuid=076050b4-d279-493c-945e-5fb3ff2af32e

配置Dart和Flutter插件到我们的idea中

打开idea,Create New Project——>选择Flutter,选择SDK路径后Next——>命名项目名(小写),选择项目存储路径后ok。


然后进去以后可能你看到并没有下载项目资源,不要慌,我们配置一下,具体的如下所示,第一张是配置DartSDK的路径(指向前面flutter的SDK中的 bin\cache\dart.sdk),第二张是配置flutter SDK路径。配置完成后重启ide,再重新创建新项目即可,等待的时间会比较长,耐心等待完成就可以了。


我们第一次运行是需要创建一个模拟器,需要根据 andriod sdk 下载对应镜像,在settings里找到android skd的配置,点edti

在弹出窗口中点next 开始下载


下载完成需要等待一定时间,下载完毕点finish按钮

下载需要的系统镜像


接着就可运行项目,配置运行到 Chrome (web)

运行结果

至此,配置完毕

到此这篇关于Flutter + Idea 环境搭建及配置的文章就介绍到这了,更多相关Flutter Idea 环境搭建内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Windows下搭建Flutter开发环境

    前言 从来没接触过flutter,我将在这里记录下我的flutter学习踩坑历程. 安装 就从安装开始叭,官网链接在此.先遵照官网教程来叭. 系统要求 文档记录了系统要求: 操作系统 Windows 7 SP1 or later (64-bit), x86-64 based. 磁盘空间1.64G以上(不包含工具和IDE) 工具: Windows PowerShell 5.0 或者更新的版本,(windows10自带) git windows版2.X以上,确保配置过环境变量,在powershell

  • MacBook M1 Flutter环境搭建的实现步骤

    目录 一.基础环境搭建 git: Flutter SDK: CocoaPods: 二.安装IDE IDEA: Xcode: AndroidStudio: 三.跑一个app试试 最近入手了Apple M1,MacBook Air,由于之前未使用苹果系列产品,并且Flutter官方和各项配套的软件环境也还没有成熟,导致搭建环境时碰到了不少坑,这里总结记录一波,来看文档的同学,有不懂的地方直接发评论或者消息就好 一.基础环境搭建 git: 我是装完homebrew,git就装好了,homebrew的安

  • Android Studio下Flutter环境搭建图文教程

    一.Flutter介绍 Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面.Flutter可以与现有的代码一起工作.在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费.开源的. 二.环境搭建 Flutter 的环境搭建⼗分省⼼,特别对应Android开发者⽽⾔,只是在AndroidStuido上安装 插件,并下载flutterSdk到本地,配置在环境变量即可,其实 中⽂⽹的搭建Futter开发环境 已经很贴⼼详细,从

  • Android Studio 下 Flutter 开发环境搭建,Flutter,Dart 插件安装,Flutter SDK 安装,环境变量配置,开发环境检查

    I . Flutter 学习资料 Flutter 学习资料 : ① 官方文档 : https://flutter.dev/docs ② Flutter Android 开发者文档 : https://flutter.dev/docs/get-started/flutter-for/android-devs ② Flutter 插件库 : https://pub.dev/ II . Flutter 开发环境搭建 Flutter 开发环境搭建 : ① Android Studio : https:/

  • Windows实现Flutter环境搭建及配置这一篇就够了

    最近正式入坑Flutter,首先从环境搭建开始,看了网上好多关于Windows环境搭建的资料,基本都是按官方文档写的,看完的感受是,还不如直接去看官方文档. 官方英文文档传送门:Get Started: Install on Windows . 本文主要总结我实际搭建的过程,最后发现不一定按网上那些博客或者官方文档写的来也可以搭建成功. 总的来说需要的也就4样东西,找齐了配置一下就OK: (1)Flutter SDK (建议下载官网的,下载完直接能用) (2)下载Dart插件 (3)下载Flut

  • Flutter + Idea 环境搭建及配置教程

    目录 安装Flutter SDK 安装flutter 下载SDK Manager Tools 下载需要的平台及工具 配置环境变量 安装Dart和Flutter插件 下载需要的系统镜像 最近正式入坑Flutter,首先从环境搭建开始,看了网上好多关于Windows环境搭建的资料,基本都是按官方文档写的,看完的感受是,还不如直接去看官方文档. 英文文档传送门:Get Started: Install on Windows 中文文档传送门:Get Started: Install on Windows

  • Windows下Flutter+Idea环境搭建及配置

    最近正式入坑Flutter,首先从环境搭建开始,看了网上好多关于Windows环境搭建的资料,基本都是按官方文档写的,看完的感受是,还不如直接去看官方文档. 英文文档传送门:Get Started: Install on Windows 中文文档传送门:Get Started: Install on Windows 本文主要总结我实际搭建的过程,最后发现不一定按网上那些博客或者官方文档写的来也可以搭建成功. 总的来说需要的也就4样东西,找齐了配置一下就OK: (1)Flutter SDK (建议

  • Win10下Python环境搭建与配置教程

    本教程为大家分享了win10下Python环境安装配置教程,供大家参考,具体内容如下 1.在https://www.python.org/downloads/release/python-352/网站上下载python版本 2.配置环境 右击计算机属性,然后选择高级系统设置 3.选择环境变量,配置Path输入;C:\Users\小红\AppData\Roaming\Microsoft\Windows\Start Menu\Programs\Python 3.5 4.测试python有没有安装成功

  • Java运行环境搭建的图文教程

    1.Java运行环境搭建,对于初学者来说,主要下载安装jdk即可,windows操作系统再配合记事本,即可进行java程序开发.后续的学习以及工作中需要使用IDE工具进行开发,常用IDE工具是eclipse.myeclipse等. 2.jdk是啥?Java Development Kit,Java开发工具包.详情见百度百科.jdk9已经发布了,但是工作中常用的是jdk1.6版本.学习的话1.6,1.7都可以.没必要去下最新的版本. 3.jdk已经以后其他用到的工具建议都去官网下载.网上各种教程可

  • PHP服务端环境搭建的图文教程(分享)

    一.PHP服务端环境搭建 1.php 服务端环境 安装套件 xampp(apach+mysql+php解释器) F:\MyDoc文件(重要)\DL_学习\download重要资源\apache服务器组件 安装 此时进入xmapp面板显示成功运行 测试本地Apache服务器是否开启:浏览器中输入127.0.0.1 回车即可进入xmapp官网 4.修改浏览器中默认出现的dashboard文件夹 打开xmapp下htdocs文件夹下 index.php文件 配置文件中默认跳转到本文件夹 解决办法:将h

  • MyBatis-Plus集成Druid环境搭建的详细教程

    一.简介 Mybatis-Plus是一款 MyBatis 动态 sql 自动注入 crud 简化 增 删 改 查 操作中间件.启动加载 XML 配置时注入 mybatis 单表 动态 SQL 操作 ,为简化开发工作.提高生产率而生.Mybatis-Plus 启动注入非拦截实现.性能更优. 1.1.原理 1.2.特性 无侵入:Mybatis-Plus 在 Mybatis 的基础上进行扩展,只做增强不做改变,引入 Mybatis-Plus 不会对您现有的 Mybatis 构架产生任何影响,而且 MP

  • 使用Docker+jenkins+python3环境搭建超详细教程

    前言: 自动化写好后需要在服务器上每日定时运行遇到,这样的一个问题,Jenkins容器是在docker中安装的 ,然后从git上拉取代码 发现代码在jenkins容器的目录当中,运行的时候提示没有安装python环境还第三方库. 解决方法有3种: 第一种:启动jenkins容器时 将容器的目录挂载到宿主机目录上去执行(方法不能实现)Pass 第二种:在jenkins上创建本地节点,将代码拉取到本地 然后去运行本地项目(在本机上使用比较方便,但是局限性比较小) 第三种:重新封装jenkins镜像,

  • vite + react +typescript 环境搭建小白入门教程

    目录 前言 1. 使用 vite 创建 react 项目 1. npm / yarn 命令初始化 2. 输入项目名称 3. 选择框架 4. 选择 Js / Ts 5. 项目创建完成 6. 启动项目 2. 规范项目目录 3. 使用 react-router-dom 路由 1. 使用 npm / yarn 命令下载 2. 更改 react-router-dom 版本 3. 修改App.tsx文件 4. 配置 alias 别名 5. 配置 Ant Design 样式库 6. 配置axios与顶部加载进

  • Hibernate环境搭建与配置方法(Hello world配置文件版)

    本文实例讲述了Hibernate环境搭建与配置方法.分享给大家供大家参考,具体如下: 1.下载hibernate jar包:hibernate-release-4.3.5.Final,导入必要的jar包,路径为:hibernate-release-4.3.5.Final\lib\required. 包含的jar包有10个. 2.建立新的java项目. 3.学习自己建立User Library: (a)项目右键--build path--configure build path--add libr

随机推荐