一、配置Flutter开发环境（mac/windows）

● 下载Flutter SDK

● 配置环境变量

● 诊断flutter环境

1.1 SDK下载方式1：

前提你的电脑中已经安装 Git 管理工具

git clone https://github.com/flutter/flutter.git

注意：务必将flutter包下载到英文目录下

1.2 SDK下载方式二：

官网下载，国内下载网站：

归档列表 | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter

选择自己电脑系统对应的版本下载即可：

1.3 SDK下载方式三（推荐）：

直接从我百度网盘中资料下载即可：

通过网盘分享的文件：Flutter安装
链接: https://pan.baidu.com/s/10mq83VaPQDNrDMITeT2ovA 提取码: 1234 
--来自百度网盘超级会员v1的分享

下载完成后解压文件

下述配置环境变量我以方式三下载的文件为例：

二、配置环境变量-mac

1. 检查mac环境变量生效文件

echo $SHELL

如果显示/bin/zsh 说明.zshrc是配置文件，如果是/bin/bash 说明.bash_profile是配置文件

2. 找到根目录的隐藏文件.zshrc 或.bash_profile

3. 打开并配置如下环境变量

export PUB_HOSTED_URL = "https://pub.flutter-io.cn"
​
export FLUTTER_STORAGE_BASE_URL = "https://storage.flutter-io.cn"
​
export PATH = "你自己电脑的路径(非中文目录)/flutter/bin:$PATH"

4. 执行命令让配置生效

source ~/.zshrc 或者 source ~/.bash_profile

三、配置环境变量-windows

F:\Chengxusheji\Flutter\flutter\bin

4. 添加两个环境变量PUB_HOSTED_URL和FLUTTER_STORAGE_BASE_URL

PUB_HOSTED_URL

https://pub.flutter-io.cn

FLUTTER_STORAGE_BASE_URL

https://storage.flutter-io.cn

配置完成后，一直点击确定：

四、检查环境-windows/mac

windows/mac 指令一样

flutter --version

windows 显示如下：

flutter doctor -v

mac 显示如下：

windows 显示如下：

五、创建Flutter项目

flutter create --platforms web <项目名称>

flutter create --platforms web flutter_base

六、安装运行插件

在 VSCode 或其他软件插件市场搜索两个插件进行下载：

Flutter

Awesome Flutter Snippets

七、安装Chrome浏览器

推荐安装Chrome浏览器-软件包

其他浏览器也可以例如：

等；

八、打开项目

我这里是用Trae打开的：

大家也可以用VSCode等打开

九、运行Flutter项目

运行成功如图所示