Flutter学习-01-在Mac上环境搭建

1,214 阅读2分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
之前有过简单的学习过,今天开始学习下flutter,并记录下flutter学习的知识点,记录下自己的知识点学习。

1. Flutter安装

关于flutter安装网上教程比较多,这里记录下自己安装flutter环境,flutter的官方网站

image.png 点击后选择install 我们选择macOS环境下

image.png 这里我们选择稳定版本进行下载

  • 1.1 解压并安装Flutter SDK

image.png

image.png 如果您在中国安装或使用Flutter,使用托管Flutter依赖项的值得信赖的本地镜像网站可能会有所帮助。要指示Flutter工具使用备用存储位置,您需要在运行flutter命令之前设置两个环境变量PUB_HOSTED_URLFLUTTER_STORAGE_BASE_URL

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

新版的Mac电脑终端都是使用的zsh,其配置文件路径为~/.zshrc;

老版本Mac电脑终端使用的是bash,其配置文件路径为~/.bash_profile;

image.png 跟新新系统后默认的是zsh,这样的话我们会有两份配置文件,那么我们只需要在zshrc文件最后添加如下指令,就可以直接将bash_profile文件中所有的环境变量引入zshrc

if [ -f ~/.bash_profile ]; then 
    . ~/.bash_profile;
fi

我们配置

export PUB_HOSTED_URL=https://pub.flutter-io.cn #国内用户需要设置
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn #国内用户需要设置
export PATH=/Users/*****/****/flutter/bin:$PATH

配置完成之后,重新打开终端,或者直接在终端中输入指令重新载入配置:

# zsh 指令
source ~/.zshrc

# bash 指令
source ~/.bash_profile

2.android studio 安装

我们知道flutter是跨平台开发,需要用到Xcode和android, android studio 下载Mac端下载地址其中 image.png 我们根据向导安装即可,之后需要安装几个sdk

image.png 安装 Android SDK Command-line Tools

  • 安装插件 我们需要安装两个插件Flutterdart,安装后重启即可创建flutter项目

image.png

3. 验证

终端输入flutter doctor:

image.png 基本上没啥问题 一些警告可以不用管 我们创建一个flutter项目运行一下试下

image.png 创建一个默认flutter项目,使用Xcode运行,第一次时间比较久。

截屏2021-10-17 下午11.47.50.png