声明:本文最初以相同标题,以 ljgibbs 为作者,由本人发布在知乎文章中。
“VSCode 了解一下 ,很好用,开源免费,详见布道指南”
大约在两年前第一次听到 VSCode,微软出了个编辑器,感觉还挺酷,于是开始试着用用。用着用着,感觉越来越好用。两年来不断升级版本,2018 年的今天,VSCode 感觉已经快和两年前的版本像两个软件了。
我一直使用
VSCode 作为我的编辑器,最近,我开始把 VSCode 推荐给实验室的同学们,做一个 VSCode
的“布道者”。但你不能推荐了就不管啊,“VSCode 了解一下 ,很好用,自己 bing
下载吧,下载安装很容易的,然后别来烦我了。“这样可没法和 nodepad,subline这些已经装在实验室电脑上的编辑器竞争啊。
“怎么设置中文?怎么装
Verilog 插件?怎么换字体?怎么设置 ISE/Vivado 中的文本用 VSCode 打开?”我很乐意回答这些问题来帮助更多人入手
VSCode,但对每位朋友一一回答就没有效率来完成 VSCode 的“布道”了。所以,有了这篇文章:
“VSCode 了解一下 ,很好用,开源免费,详见布道指南”
下载
Visual Studio Code - Code Editing. Redefinedcode.visualstudio.com

直接通过上面的传送门前往官网,或者 baidu/google/bing VSCode 前往官网。

Windows 用户在首页就可以直接点击绿色按钮下载,其他操作系统用户可以选择 other platform 前往下载页面。顺带提一句,由于 VSCode 跨平台特性,我使用过的的 Linux 版本 VSC 也提供了非常一致的使用体验。
安装
安装就是典型的 Windows 用户友好型安装,一般直接 Next 即可。

需要指出的是在这个页面的选项,一般建议勾选其他中的第一,二项,将“通过VSCode 打开 “操作添加到 文件和目录的上下文菜单。添加完成后,可以对文件,目录点击鼠标右键,选择使用 VSCode 打开。

另外,将 VSCode 注册为受支持文件类型的编辑器选项的意思是默认使用 VSCode 打开诸如 txt,py 等文本类型的文件,一般也建议勾选。
至于最后一项,添加到 PATH ,作为一个 Windows 用户,你选就完事了,Windows 怎么会骗你。另请注意重启后环境变量才会生效。
安装中文语言包
在某个版本后,VSCode 通过语言包的形式支持各国语言,语言包在 GitHub 上征集优秀的本土化翻译。在左边栏的最后一个图标:扩展 中搜索 Chinese,选择 Chinese (Simplified) Language Pack 安装,重启软件即可。

安装 Verilog 插件,高亮 Verilog 语法
我们实验室的同学们主要方向是
FPGA 开发,使用各种编辑器的内在原因在于 X 家的 EDA 工具的内置编辑器实在太不好用。VSCode
支持大概世界上所有语言的语言高亮,只要添加相应语言的插件,VSCode 一般会在安装插件后自动识别文件后缀名,显示相应的语法高亮。
同样是在左边栏最后一个图标:扩展 中搜索 verilog ,一般选择最高星数的扩展,安装并根据提示重载软件即可。

ISE 中设置 VSCode 为默认编辑器
虽然 ISE 中的编辑器不太好用,但提供了使用第三方编辑器替代原生编辑器的设置,当然,只能在 ISE 的窗口之外打开。

设为 {D:/Program Files/Microsoft VS Code/Code.exe(你的VSCode安装路径)} -g $1:$2
使用{ }包围你的 vscode 安装路径,并使用 / 分隔,而不是 windows 默认的 \。不然可能会出问题。
一般来说,你也可以直接设为 Code.exe -g $1:$2 因为安装时已经添加了环境变量。不过环境变量一般会在安装完,重启后生效。
修改字体大小
这里以修改字体大小为例,其实很多设置都是类似的模式。习惯了 GUI 下修改设置的同学可能会对 VSCode 的设置感到陌生。(是的,和上图 ISE 那种典型的,点开 perference,然后点点点的模式很不一样)

首先选择上方菜单中的
文件-首选项-设置,然后出现的界面可能会让你有点费劲,等一下,为什么修改字体大小变得这么容易?!你只需要选择文本编辑器栏中的字体,即可在右边的字体一栏中修改,修改完毕保存即可。整个设置过程相当友好,每个设置栏基本上都会有相应提示,友好到我怀疑自己为什么要写这一节。。

其实这么说吧,写上一段之前我更新版本到了 1.27.2 ,然后发现设置就变得如此容易。这正展示了 VSCode 的快速迭代特性,社区呼吁的内容,在很短时间内就会被添加到软件中,每次更新都可能给你一点小惊喜。。。惊喜
话说,以前的设置界面你们感受下就好,反正新版本之后就有更好的选择了。

”将您的设置放入右边编辑器以覆盖”什么的看看就好,这个知识点不再考了。。

文件比较
VSCode 提供了基础的文件比较功能,事前声明:和 BeyondCompare 不能比,可人家是个收费软件,是不是。
参与比较的文件必须都列在左侧资源管理器中,你可以打开一个文件夹,或者创建一个工作区以添加多个文件夹进行跨文件夹文件的比较。
首先选择第一个待比较的文件,这个文件会以只读形式打开,无法编辑。在左侧资源管理器中选择文件右键,选择进行比较

接下来选择第二个文件,选择上图中的与已选择项目进行比较,该文件可以进行编辑。比较的页面如下图,有区别的地方会分别用红色以及黄色标出缺少以及新增的内容。

VSCode 当前版本有个小问题,当你切换到别的页面后,这个比较页面会被关闭,很不方便。对此,可以在页面标签上右击,选择“保持打开状态”。
快捷键
快捷键能够显著提升工作效率,这也已经是老生常谈了。这里给出一些常用,基础的快捷键,很多内容在 Verilog 这类硬件描述语言开发中尤其有用。
Ctl + F ·······················································查找
Ctl + H ·······················································替换
Ctl + / ························································注释/取消注释所选行
Ctl + Shift + Alt + ↑ / ↓ ························ 向上 / 下复制当前行
Alt + ↑ / ↓ ················································· 向上 / 下移动当前行
Ctl + Alt + ↑ / ↓········································ 向上 / 下扩展行光标
扩展行光标在整理 Verilog 代码 / 写 Python 中很好用,能为你省下不少时间。使用 Esc 退出多行光标模式

保持这个习惯,工作到退休应该能为省下等一趟767的时间
更多的快捷键可以从文件-首选项-键盘快捷方式打开快捷键页面查看

结语
VSCode 布道指南第一期就到这里了,本期大概讲述了 VSCode 的下载,安装,设置中文,安装插件,设置 VSCode 为 ISE 默认编辑器,设置以及快捷键等操作。
下一期想讲讲自己编写 用户代码片段 以及如何使用集成在VSCode 中的 Git 组件,体会版本管理的快乐。(我只会一点儿 Git ,但也感受到了快乐 (*^▽^*))。
关于本期的操作有什么疑问,可以私信或者直接问我,虽然我对 VSCode 只是略有了解,但我对你选择尝试一下 VSCode 还是感到非常高兴,也高兴能帮上忙。
声明
题图以及文内部分图片来自网络,版权归版权方拥有。

颜色主题
如果你不喜欢默认的黑色主题,你可以在 文件-首选项-颜色主题中选择其他配色的颜色主题。如果你不是太喜欢预置的颜色主题,你还可以去下载第三方制作的颜色主题
Themes Extensions for Visual Studio Code in Marketplacemarketplace.visualstudio.com
感谢
向我推荐的他制作的主题,喜欢的朋友可以试试
Eva Theme - Visual Studio Marketplacemarketplace.visualstudio.com

虽然我个人还是喜欢 dark 。。。
网友评论