ESP32-C3 VScode 开发环境搭建(基于 ESP-IDF—Windows 和 Ubuntu 双环境)

更新放在最前面
更新于 2022/9/8 ,现在的 Vscode ESP-IDF 插件完全可以做到全自动一键安装,亲测有效!!!
Windows 环境下安装增加说明(2022/9/8)
最近为了写 Linux 专栏,换了一台新电脑,然后最近参加中秋节活动,自己又使用 ESP32-C3 画了一块“月饼”, 在新电脑上面配置环境,相比较以前,更加顺利了,特此来说明。
所有的安装只需要按照 Vscode ,然后直接在 VScode 中安装 ESP IDF 插件,一切都交给插件安装即可。
以前的一些问题基本都解决了,因为以前有些问题,为了保险起见,我使用的还是 EXPRESS 安装,然后版本比以前多了一些,也是为了保险,没敢选择最新的,选了 v4.3.3 版本。

然后一切交给插件,完全自动安装。
还是很顺利,最后也给乐鑫点个赞,大家都在进步,都在改进!!
Windows 环境下安装增加说明(2022/2/9)
春节回老家,在老家的电脑里面安装了一下开发环境,Windows 环境,确定了如果使用的是 VScode 的 ESP IDF 插件安装,是不需要提前安装 Git 和 Python,使用插件会全部自动帮你安装好,根据此文的内容,手动下载 V4.3.1 版本解压,然后按照步骤(直接安装 VScode,通过 ESP IDF 插件操作),选择 EXPRESS 安装,如果失败,多试几次,总之比最初安装顺利很多。
一、Windows 环境下安装
1.1 安装 Git
直接搜索 Git,到官方网站下载,地址:Git官方下载地址

下载完毕,双击安装:

除了开始选择一下安装路径,后面大部分默认就可以:

安装完成,点击 Finish 即可:

安装完成以后记得添加一下环境变量(现在软件很多都可以自动添加环境变量,在安装的时候选择一下 Add to PATH,如果没有自动添加环境变量就需要自己手动配置一下):

最后测试是否安装成功,可以在 cmd 里面输入 git 查看:

1.2 安装 Python
( ESP-IDF 会自动安装 Python,至于这里是不是必须提前安装,我本来想测试一下,但是即便我使用了 2 台电脑安装开发环境,因为过程都不是一帆风顺,都是这里或者那里出了问题,所以是否必须安装我没有 100%的定论,讲到底,还是 IDE 环境 bug 多,不知道是哪里出问题,都是重新安装,管他必不必须的全部安装再说!!!)
直接搜索 Python,到官方网站下载,地址:Python官方下载地址

下载完毕,双击安装:

安装步骤界面如下图:



虽然界面可以选择 Add Python 3.10 to PATH,但是我安装完因为不是默认路径,还是得手动添加一下环境变量:

最后测试是否安装成功,可以在 cmd 里面输入 python 查看:

1.3 安装 VSCode
直接搜索 VSCode,到官方网站下载,地址:VSCode官方下载地址

这个 VSCode 就和普通的 Windows 软件一样,这里步骤省略 。。。
VSCode 安装好可以直接使用,但是为了各种方便和支持,会需要安装各种各样的插件,具体的可以自己网上查看一些好用的插件。
我们此文说的 ESP IDF 也是以插件形式存在于 VSCode 中的。
1.4 安装 VSCode 下的 ESP IDF 插件
1、VScode 安装 Espressif IDF 插件,打开 VScode,在插件栏目搜索 ESP,找到插件点击安装即可,如下图 :

2、插件安装完毕,点击左边乐鑫图标,选择 SDK 和 Tools 安装,如图(这里选择注意,第一次建议使用 EXPRESS 安装,因为后面提到必须手动下载 SDK 版本,我测试了 2 台电脑,两台电脑第一次安装选择 ADVANCED 都会出问题,就是安装不上,最后都只能是先通过 EXPRESS 安装才能正常:

3、选择 ADVANCED 后,需要选择下载服务器,ESP-IDF 版本,安装路径,修改完成点击 Install,如下图:

4、完成上述步骤,等待安装即可,出现如下界面:

期间报错,下载 ESP-IDF V4.3.2 的时候出错,下载不了,试了几次都不行:

于是换了低一级的版本,可以正常下载:

期间在下载 ESP-IDF Tools 的时候,弹出过一个选框,提示是否继续下载,点击继续:

5、安装完成图示:

按 F1: 可以输入 ESP-IDF: xxxx 配置对应的项目,这下面是几个需要用到的:

Configure ESP-IDF 可以重新打开下面界面:

1.5 示例测试
( 额外说明,对于在使用过程中,如果提示建议安装什么插件,还是选择安装,这样减少使用出错情况)
在 VScode 界面,按 F1,找到 ESP-IDF 的示例展示。
如果你没有按照其他的拆件,第一次使用,F1 是可以直接找到的,但是如果和我使用的 VScode 一样,已经安装过其他插件,F1 可能直接看不到 ESP-IDF 的选项,需要自己搜索出来,如下图:

第一次找到以后,可以自己修改一下快捷键,方便后面使用:

打开展示示例项目 ,可以看到很多示例:

然后我们选择一个示例做测试,先在左边选择一个示例,然后点击使用示例创建工程,选择想要保存工程的文件夹,步骤如下图:

然后选中打开的项目,点击左下角 小圆筒 图标,选择编译:

可以看到成功编译。然后我用自己的画的板子准备烧录一下,自己画的板子博文连接:
自己画一块 ESP32-C3 的开发板(第一次使用立创 EDA)(PCB 到手)
https://xie.infoq.cn/article/30387388381a0d915b2494f91
1.5.1 V4.3.1 的版本手动下载
但是在设置芯片为 ESP32-C3 的时候,一直出错,当然也不能烧录:
ESP32-C3 在 V4.3.1 的版本以后才支持的 !!!

没办法,也不知道在 VScode 上面怎么更新,还是自己单独去官方下载一下:
这里直接给一个 V4.3.1 的版本 的下载地址:V4.3.1 的版本下载

下载完成,解压,替换以前版本的文件:

重新打开 VScode,可能需要重新配置,没关系,根据开始的步骤,正常操作一遍
后面测试了几个小时,各种小问题,发现要开发 ESP32-C3 还必须得手动下载了以后通过这里 Find ESP-IDF 安装,因为我写这篇文章的时候,插件里可以选择 v4.3.2 版本,但实际上 v4.3.2 官方根本还没放上去!!!
而且最后还是选择了 EXPRESS 版本的方式,才最终成功的可以使用 ESP32-C3
虽然国产的芯片性价比现在已经很不错了,但是开发环境真就不能上点心吗?</font>:

最后跑了下跑马灯(花了太多时间在调试环境,所以没有测试太多东西):

点击小火苗,烧录了以后观察板子上的 LED 状态,同时看了一下串口助手:


1.6 踩下的坑
总而言之,我就是想吐槽一下,国产的芯片开发环境能不能上点心?
1.6.1 v4.3.2 版本下载不了(手动下载其他版本解决)
1、压根不存在 v4.3.2 版本,插件里面提前就可以选择了?????



1.6.2 手动安装 esp-idf-v4.3.1(已解决)
2、对于 ESP32 -C3 而言,还必须使用 V4.3 以上的版本,所以必须手动下载了 esp-idf-v4.3.1 ,然后在 VScode 里面 Find ESP-IDF,即便这样安装得 多试几次。
然后对于开始的选择:

最终因为选择下面的总是 卡主,或者这样那样的问题,最后还是选择了上面一个 EXPRESS 才解决,不好说~
1.6.3 hello_world
编译出错(换台电脑重新安装环境解决)
3、样例 hello_world
编译都出问题,简单百度了一下,我也不想花精力去解决了,唉

换了一台电脑,安装也不是那么顺利!!!,捣鼓了一阵子,安装好了,第一次编译hello_world
:

接着第二次什么都没做,还是点了一下编译:

最后还算是测试成功了:

1.6.4 USB 口下载问题(未解决)
4、本来以为很简单顺利的环境,捣鼓了我接近一天时间,我真是实在没心思去研究了,用起来再说,USB 下载还是没有简单的解决。

1.6.5 VScode 终端问题(已解决)
5、其实最后还有一个问题,是关于 python 的(<font color=#0033FF>已解决):


问题分析:
今天抽了点时间来看看这个问题,主要是看提示问题的那一行:

才想起来,我使用的是 MINGW64 的 终端,所以<font color=#0033FF>在 MINGW64 终端下执行这条指令 斜杠 需要反过来:

同时我测试了下在不同的终端下 powershell
:

cmd
:

问题解决:
确定了是终端的问题以后,需要对 VScode 的默认终端修改一下:

在对 shell 的设置栏目中,点击在 settings.json 中编辑:

改成 Window 下的默认终端:

最后测试一下,就不会有最后的问题了:

打开监视器也正常了:

1.6.6 ESP IDF 插件版本 bug(已解决)
换了一台电脑,也来安装一次环境,但是安装完 ESP IDF 插件,就折腾了我好久,插件安装完成提示重启 VScode,我重启! 重新安装 python,都测试了 N 边,还是下面这个样子!!!(我真是 XXXXXXX):

后来实在没办法,尝试了一下把插件换成低版本的!! :

第一次建议使用 EXPRESS 安装,我测试的两台电脑第一次使用 ADVANCED 都出问题,安装不成功
二、Ubuntu 环境下安装
虽然在 Windows 环境下捣鼓来捣鼓去,环境勉强搭建好了,但是感觉坑太多,想着 Linux 环境下面会不会好多了,于是还是准备在 Ubuntu 虚拟机里尝试搭建一下环境。
具体的步骤在官方有介绍,地址为:乐鑫官方ESP-IDF安装说明

官方既然有文档为什么我还要更新一下博文说明一下,那实在是因为自己安装过也是一路坑坑洼洼!一言难尽!本来也只是想自己默默的搭建好直接用,但是一些出现的问题让自己也得好好做一下笔记。
2.1 基本安装(Git、Python、PIP、VScode)
pip 是一个 Python 包安装与管理工具,如果你使用的 Python 是 2.7.9 及以上版本,或 3.4 及以上版本,则已经内置了 pip ,可直接使用。
这里我实际上是单独安装了一次,如果一切顺利应该是不需要安装的,因为我测试安装的开发环境尝试了好多次,以前由于各种原因安装失败了,就直接没管了,最近确实是需要好好搭建环境,才重新尝试,所以虚拟机里可能有些以前安装过的软件
在 ubuntu 下的安装相对来说,还是比较简单的,几条指令:
安装 git:sudo apt-get install git
安装 python3:sudo apt-get install python3
安装 pip:sudo apt-get install python3-pip

VScode 安装:
在 Ubuntu 软件中直接搜索 VScode,可以找到安装,如下图:(这种方式可能会卡主,所以建议下面的第二种,直接下载安装包)

到 VScode 官方网站下载安装包:VScode官方网站

下载完成安装包以后,直接打开点击安装即可。
2.2 环境配置
需要的组件安装好以后,是需要进行环境配置的,最初我以为和 Windows 下一样,通过 VScode 下载 Espressif IDF 插件以后,自动安装就行了。
说明,即便在 Ubuntu 下面,目前来说(以为后期官方可能修复或者更新 4.3.2 版本上去)要开发 ESP32-C3 还是需要手动下载 V4.3.1 ,放置对于的位置,进行配置(手动下载替换的具体的方式和 Windows 下的一样):

配置完成以后结果如下,是有些问题的( 后面才知道是 python 版本的问题):

直接使用 VScode 配置工程环境是不行的:


2.2.1 设置工具
后来查看了下官方手册,需要设置工具,如下图:

需要在 esp-idf 目录下使用./install.sh esp32c3
设置一下工具:

上图出了问题,具体还是环境的问题。
具体如何解决,在网上查找了相内容,可能是因为 python 版本的问题,我们可以通过查看版本和路径查看相应的内容,查看当前系统使用的 python 版本等,如下图:


发现虽然已经安装好了 python,但是其实有很多个版本,上图系统默认的还是 Python 2.7.17,所以这可能就是问题的根本了。
2.2.2 ubuntu 修改默认的 python 版本
这个小结介绍 ubuntu 修改默认的 python 版本,这里我参考了另一篇博文,先使用 ls /usr/bin/python*
查看一下目前的 python 版本有多少:

具体的根据博文中的操作,一步一步输入指令:
sudo update-alternatives --install /usr/bin/python python /usr/bin/python2.7 1
sudo update-alternatives --install /usr/bin/python python /usr/bin/python3.6 2
sudo update-alternatives --config python
完成后再次使用 python --version
查看当前环境 python 版本,具体步骤如下图,其中有一些警告错误,但是结果是成功了:

2.2.3 'sys_platform == "win32"' don't match your environment
上面配置完成默认 python 版本,再次执行 ./install.sh esp32c3
,看上去还是有问题:

因为确实不是很熟悉这个环境,所以继续去网上找答案,无奈确实没有找到对应的,但是执行这条指令最后如图:

上图中的结果开始就有了,只不过即便完成了这样,通过 VScode 大概工程也并没有成功,所以到最后其实自己都不知道哪一步解决了什么问题,只能除了问题,重新来一遍 = =!
2.2.4 PIP 更换国内安装源(不确定是不是必须)
在此期间为了解决'sys_platform == "win32"' don't match your environment
的问题还去网上找了找,并没有找到确实的问题解决办法,但是还是根据一些擦边的帖子,进行了对于的修改:
参考了博文:PIP 更换国内安装源
根据上面博文的回复栏里面的内容,进行了一定的设置:

起初我并不知道 pip.conf
在什么位置,即便博文中提到自己创建一个,也不知道在什么位置创建,所以在回复栏里面看到对应的回复,进行了第一步操作:
pip config set global.index-url https://pypi.tuna.tsinghua.edu.cn/simple
操作完第一步,也能看到
pip.conf
的位置,于是根据另外一个回复修改了pip.conf
文件:
这样迷迷糊糊修改完成,然后测试了一下:

看上去问题还在,其实这个环境安装这个,安装哪个都是重复来,重复去,至于顺利的一步到位的流程,真的太难写出来,这个问题往后面放,看到官方的文档,试着进行了一下环境配置。
2.2.5 环境配置
在 2.2.3 小结的结尾的图,也是提示
在官方文档中第 4 步 是安装环境变量:

所以需要执行一遍配置环境变量,注意指令是. $HOME/esp/esp-idf/export.sh
,执行成功如下图:

看提示应该是安装好了,环境变量设置完成以后,查看 pip 和 python 的版本,都会变成是如下路径了:

这一步环境配置好以后官方文档是说可以创建工程了,其实最后如果出了问题,我会把这些步骤都重复一遍,所以真正的顺序,真的不太好说= =!
2.3 环境测试
2.3.1 VScode 插件配置
反正也不知道,在 VScode 下面重复过多少次下面的步骤了:
在 VScode 界面下,输入 F1,选择 IDF Configure:
在 VScode 下进行配置, 3 个选项不停的测试 = =! 所以最终环境好了也不知道是哪个决定性的操作搞好了....
不管使用 EXPRESS 还是 ADVANCED 还是别下面的,结束时都是如下界面:
2.3.2 工程编译测试
工程编译测试步骤和 WindowS 一样:
根据样例新建一个工程;
选择芯片,不报错就可以,报错前面一些环节又重复一遍= =!如果选择芯片不报错大概率环节就好了
编译烧录编译就点击编译图标,一般来说芯片可以正常选择了就没有问题了。
2.3.2 烧录
正常插上 USB,连接到虚拟机,能够识别出来,编译通过但是烧录的时候报错了(忘了添加 USB 的权限):

可以使用sudo chmod -R 777 /dev/ttyUSB0
,然后就可以正常下载:

但是这样设置重启以后又需要输入一般,这个看个人习惯,如果不觉得麻烦问题不大。
如果想让自己的账号获得 root 权限,可以使用sudo usermod -aG dialout xxx
xxx 为你的用户名
此命令的意思是 将用户添加到附属组群,改变用户 sudo 权限:

这样每次重启后下载都不需要再次给权限了。
总结一下,这个环境也是一言难尽,好在最后是完成了搭建,并且可以正常运行。前面也说过,因为测试出了问题,很多步骤都会重复再重复,并不知道绝对的先后顺序,把官方文档上的所有步骤都过一遍,然后再在 VScode 中进行设置。 总之多试试把 = =!
版权声明: 本文为 InfoQ 作者【矜辰所致】的原创文章。
原文链接:【http://xie.infoq.cn/article/5b639e112cabba00cc1b8941a】。文章转载请联系作者。
评论