配置Flutter中国镜像
因为有可能被墙,所以需要配置镜像。
国内有两个镜像可以用,一个就是官方 Flutter 社区的国内镜像,另一个是上海交通大学 Linux 用户组的镜像,建议用官方 Flutter 社区的国内镜像。
- Flutter 社区
FLUTTER_STORAGE_BASE_URL: https://storage.flutter-io.cn
PUB_HOSTED_URL: https://pub.flutter-io.cn
- 上海交通大学 Linux 用户组
FLUTTER_STORAGE_BASE_URL: https://mirrors.sjtug.sjtu.edu.cn
PUB_HOSTED_URL: https://dart-pub.mirrors.sjtug.sjtu.edu.cn
配置方法
在~/.bash_profile
上添加:
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
保存文件后,在运行:
source ~/.bash_profile
一、下载Flutter SDK包
下载地址:SDK包
二、配置环境变量
1、
vim ~/.bash_profile
2、找到sdk文件的位置,我是放在了根目录的sdk文件下,因此:
export FLUTTER_HOME=/Users/menghua.ma/sdk/flutter //这个路径就是压缩包解压后的位置
export PATH=$PATH:$FLUTTER_HOME/bin
3、检查是flutter是否安装成功
flutter -h
出现下图的内容,证明成功了
三、检查开发环境
使用flutter的检查一下都需要安装哪些软件和插件的支持:
➜ ~ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.5.4-hotfix.2, on Mac OS X 10.12.6 16G1918, locale zh-Hans-CN)
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.0)
[!] iOS toolchain - develop for iOS devices (Xcode 9.2)
✗ libimobiledevice and ideviceinstaller are not installed. To install with Brew, run:
brew update
brew install --HEAD usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
✗ CocoaPods installed but not initialized.
CocoaPods is used to retrieve the iOS platform side's plugin code that responds to your plugin usage on the Dart side.
Without resolving iOS dependencies with CocoaPods, plugins will not work on iOS.
For more info, see https://flutter.dev/platform-plugins
To initialize CocoaPods, run:
pod setup
once to finalize CocoaPods' installation.
[!] Android Studio (version 3.4)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
[!] IntelliJ IDEA Ultimate Edition (version 2016.3)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
✗ This install is older than the minimum recommended version of 2017.1.0.
[✓] VS Code (version 1.22.2)
[!] Connected device
! No devices available
! Doctor found issues in 4 categories.
图片上的每一条都是需要打勾的状态才对,如果有[!]x标志,表示本行检测没有通过,就需要我们根据提示设置或者安装相应的软件了。
⚠️Android toolchain - develop for Android devices
是代表着要安装Android 开发环境,如果没有安装的话,需要安装一下,步骤在下边。
⚠️brew install --HEAD libimobiledevice
:此时有可能会出现权限被拒绝的错误,那么就先执行sudo chown -R $(whoami) /usr/local
,然后再brew install --HEAD libimobiledevice
⚠️pod setup
的时候有可能会出现如下报错:
emote: Enumerating objects: 20009, done.
remote: Counting objects: 100% (20009/20009), done.
remote: Compressing objects: 100% (9896/9896), done.
error: RPC failed; curl 56 SSLRead() return error -980677.00 KiB/s
fatal: The remote end hung up unexpectedly
fatal: early EOF
fatal: index-pack failed
那么此时就参考一下文章执行:https://blog.csdn.net/YangxLan/article/details/73930755?locationNum=3&fps=1
三、安装Android/IOS 开发环境
配置Android开发环境
1、下载Android Studio
因为需要用到Android 开发环境,所有需要下载。
下载地址:Android Studio,选择Mac的版本就OK。
或者去官网下载:Android Studio官网
2、配置Android SDK环境变量
打开 Android Studio,选择 Confiure -> 'SDK Manager':
记住这个地方的SDK的位置,在~/.bansh_profile
添加:
export ANDROID_HOME=/Users/****/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
此时已经配置好了Android的开发环境,但是Android Studio需要安装Flutter插件才可以支持Flutter。
搜索Flutter进行安装。安装完成以后重启Android Studio。
配置IOS开发环境
1、安装Xcode:由于我的电脑不支持最新的11版本,因此着了一个其他版本下载:download
2、运行:
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
3、打开Xcode,同意Xcode的许可协议
4、运行
sudo xcodebuild -license
Flutter的编辑器
VS Code
1、安装VS Code:VS Code
2、安装Flutter插件(如下图所示),安装完成后relaod一下,然后重启VS Code。
Android Studio
上面已经配置Android开发环境的时候已经写啦,请参考。
参考了以下文章:🙏🙏🙏
⚠️Flutter完成手册
⚠️技术胖--Flutter基础知识
Flutter web环境(1.5版本才可以)
https://segmentfault.com/a/1190000019381936?utm_source=tag-newest
https://www.v2ex.com/t/569744
运行flutter web必须安装webdev才可以,webdev也需要安装。
1、安装webdev package包
flutter pub global activate webdev
此时会有出现一个警告(如下图),也就是更新一下环境变量,按照提示做就可以
2、clone官方的例子到本地(此步骤可以直接跳过,如果自己有flutter web项目的话)
git clone https://github.com/flutter/flutter_web.git
进入到example/hello-word中,运行flutter pub upgrade
cd examples/hello_world
flutter pub upgrade
3、运行webdev serve
(此步骤也可以略过,跳转到步骤4)
webdev serve
如果此时有如下警告,则是因为没有将dart sdk加入到环境变量中,dart sdk是在安装的flutter/bin/cache/dart-sdk/bin
目录下,找到添加环境变量即可
dart: command not found
添加好环境变量再次运行webdev serve
,此时会提示需要运行pub get
,那就运行一下就pub get
,再次运行webdev serve
即可。
4、如果不想配置dart sdk的环境变量,可以使用下面的命令代替webdev serve
flutter pub global run webdev serve
5、如果想要自己创建web项目,有两种办法,一种是同创建android或者ios的一样(此处不在赘述),一种是用命令行工具。
命令行创建 web 项目需要安装另一个工具
flutter pub global activate stagehand
安装好之后就可以创建web项目(注意:创建项目的地方一定是一个空文件夹)
flutter pub global run stagehand flutter-web-preview
或者
stagehand flutter-web-preview(这种必须是配置了dart sdk的环境变量)