Flutter环境安装详细介绍,Mac+Windows

1,924 阅读2分钟

Flutter 是 Google 开源的 UI 工具包,帮助开发者通过一套代码库高效构建多平台精美应用,支持移动、Web、桌面和嵌入式平台。Flutter 开源、免费,拥有宽松的开源协议,适合商业项目。

Flutter官网:flutter.dev/

必备环境

安装步骤:

  1. 下载对应系统的Flutter SDK:flutter.dev/docs/get-st…

也可以去Flutter项目的Github仓库里下载,但哪种方式下载速度都不是特别快,将就一下吧,没办法。

  1. 下载完SDK后就可以把Flutter SDK解压到任意目录下了

这个目录位置很重要,下一步也要用到,我建议不要放太深,Mac的话就放到 ~/ 下,Windows就放到某个C或D盘下

  1. ★设置环境变量,加个星,这一步很关键 假设刚才你按照我说的把Flutter SDK放到了 mac ~/ 或者 windows的C盘下了
  • macOS下设置环境变量
打开终端
输入 nano ~/.bash_profile
添加以下这行
export PATH=~/flutter/bin:$PATH
  • Windows10下设置环境变量
打开”我的电脑>控制面板>用户帐户>用户帐户>更改我的环境变量“
在“用户变量”下检查是否有名为“Path”的条目:
如果该条目存在, 追加 C:\flutter\bin ,使用 ; 作为分隔符。
如果条目不存在, 则创建一个新用户变量 Path ,然后输入 C:\flutter\bin 作为它的值。
★重启Windows以应用此更改

Flutter在国内访问比较慢,甚至无法打开官网,所以我们还是使用镜像站

添加镜像站的全局变量

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
  1. 前三步如果都正确完成了的话,这时我们可以使用命令行输入以下命令

flutter doctor

  1. 现在还没有完成,你会看到不少x,但起码不用慌张了,因为有flutter doctor了,只要仔细看提示,缺什么下什么即可。

很慢,别慌,就是那么慢,耐心等待。

  • 最后的最后,把x的项目都补齐了,你就会看到以下画面

  • 非常的舒服有木有!


用什么编辑器写代码大家随意,我更推荐使用VS Code,并且大家装上Flutter的官方插件,就有代码提示,调试,编译的工具条

不想安装Flutter环境,也可以在线玩玩看

dartpad.cn/flutter