第一步:集成flutter环境。
flutter中文集成官网:官网地址
详细讲解
1.获取Flutter SDK
去flutter官网下载其最新可用的安装包
),
选择 Stable channel (macOS) 最新版本 。下载下来。
如果下载失败 去GitHub下载安装包
然后将下载的安装包 放到mac 一个位置。解压下来是flutter文件夹(可以放到mac任何位置)
2 .打开终端 直接执行下面两行替换环境变量(可以理解为实现终端翻墙 **)。
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
3. 将之前下载的flutter安装包解压。
然后执行下面语句
export PATH=`pwd`/flutter/bin:$PATH
pwd 是 路径,你安装包所在的路径 (例如/Users/Jam/Desktop/工作 是我的路径) 我这里就该写为
export PATH=/Users/Jam/Desktop/flutter/bin:$PATH
4 终端执行
flutter doctor
稍等一下 执行完毕爆红色的 是你缺少的环境。 例如iOS 就缺少安卓的相关page iOS开发的电脑 应该不会缺少xcode的
这一步执行完毕 flutter的环境 已经搭建完成。
第二步 编辑器的选择 以及编辑器支持flutter的page工作
官方推荐 有两种方式
1 Android Sstudio
2 VS Code
以上两种 page工作去 逛网查看 我这边 说的是 webstorm 开发flutter的环境page工作。
3 webstorm
下载下来安装使用 这里先不说破解版本的办法
3.1 安装 dart ,移驾官网 dart 下载
因flutter是谷歌的所以flutter选择的开发语言是dart 所以要想webstorm具备flutter编译能力 需要本地搭建dart语言 开发环境
mac 电脑可以采用homebrew 安装 如果你已经安装过了 homebrew 可以直接忽略这一行
在终端运行命令安装homebrew:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
3.2安装dart
依次终端执行 (乳沟失败 请使用翻墙软件实现终端翻墙)
brew tap dart-lang/dart
brew install dart --devel
3.3 webstorm 中 在 plugins 中下载 Dart 插件,如下图: 20190731134759491.png
3.4配置 sdk 路径:在设置中 => 语言&框架 => dart 配置 Dart SDK path: 20190731134820312.png
/usr/local/opt/dart/libexec 是我本地默认安装的 dart sdk 路径,查看自己本机的 dart 信息如下
在终端执行
brew info dart
执行结果为
JamdeMac-mini:~ jamwang$ brew info dart
dart-lang/dart/dart: stable 2.9.0, HEAD
The Dart SDK
https://dart.dev
Conflicts with:
dart-beta (because dart-beta ships the same binaries)
Not installed
From: https://github.com/dart-lang/homebrew-dart/blob/master/dart.rb
==> Options
--HEAD
Install HEAD version
==> Caveats
Please note the path to the Dart SDK:
/usr/local/opt/dart/libexec
JamdeMac-mini:~ jamwang$
这个Please note the path to the Dart SDK: 下边的就是 dart sdk 路径 大功告成
4 flutter升级 终端执行 flutter upgrade 后面跟着版本号 默认是最新的 channel stable (最新正式版正式版)
5 使用flutter doctor 最后验证 是否安装正确。
总结 如果全部都按照好了。 现在整体总结一下。 我们以后想使用 flutter 语句 每次都需要执行
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export PATH=/Users/Jam/Desktop/flutter/bin:$PATH
很麻烦 所以这里提供一个简便方法 打开你的 .bash_profile 文件 将 这三行复制到这个文件夹下
然后 以后每次打开终端 只需要 在终端执行
source ~/.bash_profile
就可以使用 flutter 了 ****** 至于.bash_profile是什么 百度一下吧 很简单的。
这里说一下 我在升级flutter 的时候 升级成功后报一个黄色警告
JamdeMac-mini:~ jamwang$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 1.20.1, on Mac OS X 10.15.5 19F101, locale zh-Hans-CN)
[✗] Android toolchain - develop for Android devices
✗ Unable to locate Android SDK.
Install Android Studio from: https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK components.
(or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).
If the Android SDK has been installed to a custom location, set ANDROID_SDK_ROOT to that location.
You may also want to add it to your PATH environment variable.
[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
[!] Android Studio (not installed)
[!] Proxy Configuration
! NO_PROXY is not set
[✓] Connected device (2 available)
! Doctor found issues in 3 categories.
Proxy Configuration
! NO_PROXY is not set
此错误 可以 在上一步的 .bash_profile 里面加上一行export NO_PROXY=localhost,127.0.0.1 在执行解决。
flutter创建OC项目 执行语句
flutter create -i objc name
name 是工程名字
参考文章:1. Mac下Dart环境安装
2.mac webstorm 配置 dart 插件
3 flutter中文集成官网:官网地址
https://www.jianshu.com/p/87e09543cedf
网友评论