FlutterSDK下载 目前我使用的版本是1.17.4,1.17.5安装后找到flutterSDK原因未知
Java环境 选择 Mac OS X x64 同意协议且注册后可下载安装包
Android Studio 下载最新版本
vs code 下载最新版本(可选)
将下载好的flutter
文件夹拖到任意位置中(我是拖到mac根目录下,所以我的路径是/Users/mac/flutter),然后在找到下载好的fultter
文件夹拖到命令行中得到flutter文件夹
路径。
在终端执行
open .bash_profile
如果没有.bash_profile,那么创建一个
cd ~
touch .bash_profile
open .bash_profile
依次将这三句话复制加进去
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
关闭保存,打开终端输入
source ~/.bash_profile
完成后,验证是否安装成功
flutter -h
出现如下结果代表安装顺利
如果输入flutter命令卡主不动,请多等一会试试
首先运行前面下载好的JDK
环,一直下一步直到安装完成
安装教程Android Studio
打开Android Stuido
软件,然后找到Plugin
的配置,搜索Flutter
插件,搜索flutter
,点击右侧install
,完成后重启,
加载不出来就开下vpn试试.
安装结束后在命令行输入如下命令,全部输入y
flutter doctor --android-licenses
下面依次输入到终端
brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
brew install cocoapods
pod setup
如果安装失败执行
/usr/bin/ruby -e "$(curl -fsSL [https://raw.githubusercontent.com/Homebrew/install/master/install](https://raw.githubusercontent.com/Homebrew/install/master/install))"
一次不行,就多试几次
brew update
brew uninstall --ignore-dependencies libimobiledevice
brew uninstall --ignore-dependencies usbmuxd
brew install --HEAD usbmuxd
brew unlink usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
直接点击安装包安装,按照提示一直下一步即可
如果需要在vscode
中运行Dart
项目,还需要配置Dart
的环境变量
目前在终端输入dart
终端输出
dart: command not found
在终端输入
open .bash_profile
将根据自己的flutter
路径添加下面两行代码
// export DART_HOME=/dart-sdk/bin 路径
export DART_HOME=/Users/mac/flutter/bin/cache/dart-sdk/bin
export PATH="${DART_HOME}:${PATH}"
关闭保存
source ~/.bash_profile
测试是否安装成功,在终端输入dart
Usage: dart [<vm-flags>] <dart-script-file> [<script-arguments>]
Executes the Dart script <dart-script-file> with the given list of <script-arguments>.
Common VM flags:
--enable-asserts
Enable assert statements.
--help or -h
Display this message (add -v or --verbose for information about
all VM options).
--package-root=<path> or -p<path>
Where to find packages, that is, "package:..." imports.
--packages=<path>
Where to find a package spec file.
--observe[=<port>[/<bind-address>]]
The observe flag is a convenience flag used to run a program with a
set of options which are often useful for debugging under Observatory.
These options are currently:
--enable-vm-service[=<port>[/<bind-address>]]
--pause-isolates-on-exit
--pause-isolates-on-unhandled-exceptions
--warn-on-pause-with-no-debugger
This set is subject to change.
Please see these options (--help --verbose) for further documentation.
--write-service-info=<file_name>
Outputs information necessary to connect to the VM service to the
specified file in JSON format. Useful for clients which are unable to
listen to stdout for the Observatory listening message.
--snapshot-kind=<snapshot_kind>
--snapshot=<file_name>
These snapshot options are used to generate a snapshot of the loaded
Dart script:
<snapshot-kind> controls the kind of snapshot, it could be
kernel(default) or app-jit
<file_name> specifies the file into which the snapshot is written
--version
Print the VM version.
终端删除如上代表配置成功
来到vscode
,在终端输入dart
,发现还是
dart: command not found
打开vscode
将终端的类型设置为bash
,重启vscode
同样在命令行输入dart
执行命令
flutter doctor
如果所有选项都是对号代表环境配置成功,否则按照提示修复对应问题。
新建一个项目
flutter create project_name
在命令行模式输入flutter run
会自动启动模拟器
zsh: command not found: flutter
第一种可能的情况是设置的flutterSDK路径错误,检查下再试
第二种macOS Catalina 版开始,您的 Mac 将使用 zsh 作为默认登录 Shell 和交互式 Shell。您还可以在较低版本的 macOS 中将 zsh 设置为默认 Shell,解决方法
VSCode可能需要安装的插件
Awesome Flutter Snippets
快捷生成代码插件
path
快速引入文件路径
Code Runner
Chinese (Simplified) Language Pack for Visual Studio Code
菜单汉化
常用的快捷键
运行项目 flutter run
创建项目 flutter create xxx
vscode
格式化代码 option + f + shift
在vscode
中的命令行模式下
r 键:点击后热加载,也就算是重新加载吧。
p 键:显示网格,这个可以看到App布局情况。
o 键:切换android
和ios
的预览模式。
q 键:退出调试预览模式。
tips
当鼠标悬停到Widget
的时候,可以看到这个Widget
都有哪些属性,
代码规范
fluttet
严格区分大小写,项目名称必须是小写