zoukankan      html  css  js  c++  java
  • 完全使用 VSCode 开发的心得和体会

    封面图片

    前言

    我刚开始是一名 Java 程序员,陪伴我最久的老伙计是 Java 世界里面出名好用的是 Jetbrains 家族的重量级产品 Intelli IDEA 编辑器,不过 IDEA 主要是用来写代码,文本编辑,配置编辑,我都是使用 Vim,Sublime Text 3 来处理,但是随着我学习的编程语言越来越多,例如 Ruby,Go,JavaScript,我的电脑开始安装很多编辑器,具体如下:

    • Intelli IDEA:用于编辑 Java 程序
    • RubyMind:用于编辑 Ruby 程序
    • GoLand:用于编辑 Go 程序
    • WebStram:编辑 JavaScript 程序
    • Sublime Text:文字、文本、JSON、XML等编辑任务
    • Vim:系统、配置文件、少量代码修改等编辑任务
    • Typora:Markdown 编辑器
    • 等等……

    且不说这么多编辑器让人眼花缭乱,光是动辄上 GB 的空间占用,也让我低配版的 Macbook 磁盘吃紧,而且不同软件之间的快捷键,界面布局不同,学习起来也造成很大的心智负担。

    最后还有一个理由就是 ,这么多软件,要买正版可不是一笔小的费用,我还没有土豪到那个地步。

    另外你问我为什么不用盗版,如果我们程序员自己还用盗版软件的话,那么不是自己砸自己的饭碗吗 ?

    我开始思考一个问题:有没有一款编辑器能解决我所有的编辑任务?

    于是我开始清点自己对于编辑的需求,整理如下:

    • 开源免费(每年几百美金的 Licence 去买好吃的不香吗?)
    • 轻量级,不太占用空间(Mac 磁盘寸土寸金)
    • 高性能,毕竟我平时有很多大文件编辑的工作
    • 扩展能力强:当我切换到其他编程语言,我不需要切换工具
    • 能解决我所有的编辑需求,例如编程语言:Java、Ruby、golang,文本编辑,Markdown,XML,JSON 等

    我开始想象,如果找到这样一款编辑器,我可以用大部分的精力去学习它,然后深入研究精通它。

    这样我所有的编辑工作都用它来完成,这样所有的编辑效率都能提高,从而整体的工作效率都能提高。

    且不说降低磁盘占用的空间,起码也可以降低不同编辑器之间的学习成本和心智负担。

    然后我就找到了它,今天我要分享使用心得的主角:VSCode

    VSCode 入门介绍

    严格意义上来说 VSCode 并不是类似 Jetbrains 产品,它只是一款纯文本编辑器,类似你在 Windows 上使用的TextPad,也类似 Mac 平台上的 TextEdit,或者 Sublime Text,所以 VSCode 的本质工作还是文本编辑。

    因为 VSCode 是基于 Electron 框架开发,所以它可以再在不安全任何插件的情况下,对 HTML、CSS、JavaScript 提供很好的支持,也这是很多前端程序员一直推崇 VSCode 的原因

    在原生情况下,它的核心功能还是编辑,但是相比传统的编辑器,VSCode 提供以下几点内置功能,所以它应该是更加适合程序员使用的编辑器,如下:

    • IntelliSense 智能提示:通过机器学习分析你过往的输入,给出代码补全和职能提示(和 IDE 的补全不同)
    • 内置 Git 支持:这里不多介绍了,程序员应该都知道 Git。
    • 内置 Terminal 终端:Sublime Text 想要集成终端都还要装插件,VSCode 开箱就送了。很方便
    • 插件市场:让你的 VSCode 扩展无限可能(这才是 VSCode 的杀手锏功能)

    最后,因为它是跨平台的编辑器,所以你也不用担心你是用 Windows 还是 Mac 操作系统了

    轻便的 VSCode

    VSCode 原生包只有 100M 大小,就算不在进行扩展包安装的情况下,已经可以替代 Sublime Text、Vim 帮我完成平时的编辑工作了,而且只需要进行简单的 PATH 配置,就可以替代原来的 vim 指令:

    原来的 vim 编辑:

    vim fileName
    

    使用 code 编辑

    code fileName				// 使用 vscode 编辑指定文件
    

    另外一个是我比较常用的技巧:使用 code 快速打开编辑目录

    cd /target/dir/
    code .				// 使用 vscode 编辑当前目录
    

    另外 VSCode 上手曲线比 Vim 更加平缓,适合新手,也更容易获得成就感,也就更容易坚持。

    性能

    除了本身占用空间小,编辑性能也是 VSCode 值得拿得出手的地方,至少目前近半年的编辑工作中还没有遇到过无法用 VSCode 打开的情况,整体性能的优化比师出同门的 Atom 还要领先许多,在我接触过的大文件加载和编辑中没有掉过链子,而且内存占用率也非常低,对比 Jetbrains 动辄 3-4G 的内存占用来说,可谓是轻便许多,使用 8G 版本的 Macbook 完成轻量级的编程工作也是没有任何问题的

    插件扩展

    扩展是 VSCode 的招牌能力了,我们看看它是如何通过扩展能力,VSCode 扩展可以通过以下2个思路解决:

    1. Extension Pack:流行的扩展包,通常找到对应语言的 Extension Pack 一键安装即可
    2. 插件:例如 Markdown,Vim 可以通过直接安装插件即可

    Java Extension Pack

    下面推荐几个替代 Jetbrains 产品的 VSCode 功扩展包:

    • Intelli IDEA:使用 VSCode + 扩展包:Java Extension Pack 解决
    • RubyMind:使用 VSCode + 扩展包:Ruby Extension Pack 解决
    • GoLand:使用 VSCode + 扩展包:Go Extension Pack 解决
    • WebStorm:VSCode 原生支持
    • TypTypora:VSCode + 插件 Markdown All in One 解决
    • 流程图:推荐插件:PlantUML (现在所有系统架构,设计类图,我都通过它来实现)

    通过上述插件,VSCode 虽然在很多其他语言开发中,还不够强大,但是满足 80% 的功能就已经足够了,最重要的是它带来的方便,轻巧,远比那些重量级的功能要好用的多

    VSCode 插件:

    好用的插件可以让 VSCode 事半功倍,推荐几个我在用并且觉得好用的 VSCode 插件给大家:

    1. Code Runner:一键运行 32中编程语言的执行器,非常好用
    2. Atom One Dark Theme:基于Atom的 One-Dark 主题。市场上最受好评的一个黑暗主题
    3. Git Graph:Git 图仓库,对于 Git 仓库提交历史一目了然,非常清晰
    4. GitLens:不多说了,VSCode 必装 Git 插件,没有之一
    5. LeetCode:平时刷题的小伙伴,一定要装,集成度非常高,墙裂推荐
    6. Markwodn Preview Github Styling:类似 Github 风格的 Markdown 解析器,常用 Github 小伙伴不能错过
    7. Peacock:多工作区标记,对于同时打开多个工作区,反复切换的同学,可以通过颜色标记,快速找到目标
    8. VScode-icons:一款美化后的 VScode 图标库,提升了很多 default icon 的美观
    9. 等等…… 期待你自己发掘
    VSCode 快捷键:

    高效利用工具的秘诀在于熟练掌握它的快捷键,

    所以推荐几个常用的 VSCode 快捷键,帮助大家提高效率:

    1. 快速打开用户设置:⌘ + .
    2. 快速打开命令面板:⌘ + ⇪ + P
    3. 快读跳转代码段:⌘ + ⇪ + O
    4. 快速查找文件:⌘ + P
    5. 跳转到指定行:⌃ + G
    6. 文件内搜索:⌃ + F
    7. 跨文件搜索:⌃ + ⇪ + F
    8. 打开终端:⌃ + `
    9. 创建终端:⌃ + ⇪ + `
    10. 代码格式化:⌥ + ⇪ + F

    日常编辑常用的快捷键就这些

    更加详细的可以自行查看 VSCode 键盘映射表(File -> Preferences -> Keymap Extensions)

    VSCode 小技巧:

    分享一些不为人知,高效且实用的 VSCode 实用经验的和技巧,如下:

    1. 用户设置分为:User Settings /Workspace Settings,它们设置页面一样,区别是全局,工作区生效范围不同
    2. 大部分的快捷操作,都可以通过控制面板(⌘ + ⇪ + P)的指令来完成
    3. 通过 “editor.tabSize”: 4 可以设置 tab 的空格数
    4. 通过 "files.exclude": {} 设置可以排除你在 VSCode 中不想看到的代码和文件
    5. 在资源管理中直接输入文件名,可以直接搜索文件
    6. 通过 View -> Apperance -> Zen Mode 进入禅模式,可以更加专注的编写代码
    7. 多光标:按住 Alt + 左键,可以同时编辑多处文本
    8. 通过 File -> Auto Save 可以直接自动保存,也可以通过 settings.json 进行更加个性化的设置

    最近几个月的 VSCode 使用心得就分享到这里,未来 VSCode 依然会是我的主力编辑器,承担的所有的写作/文本/编程的工作,毕竟它这几个月来也完成的非常出色。我相信 VSCode 在后续的版本中会越来越强大,插件也更加完善和丰富,所以投资时间学习 VSCode 应该是一件很有回报的事情

  • 相关阅读:
    人工智能背后的故事
    idea 开发插件。
    安卓工作室 Android studio 或 Intellij IDEA 美化 修改 汉化 酷炫 装逼 Android studio or Intellij IDEA beautify modify Chinesization cool decoration
    安卓工作室 android studio文件和代码模板,以及汉化出错问题
    安卓工作室 android studio 汉化后,报错。 设置界面打不开。Can't find resource for bundle java.util.PropertyResourceBundle, key emmet.bem.class.name.element.separator.label
    android studio的汉化 教程 及解析
    安卓工作室Android Studio 快捷键
    安卓工作室 android studio 的 汉化 美化 定制 Android studio's Chinesization beautification customization
    VR开发 VR development
    Lakeshore 中文开发界面,示例项目,飞机大战 等 Lakeshore Chinese development interface, sample project, aircraft war, etc
  • 原文地址:https://www.cnblogs.com/xiao2shiqi/p/14507348.html
Copyright © 2011-2022 走看看