• 题图由 Microsoft Designer 生成。
  • 本文旨在从工科研究生日常需求（记笔记、写代码和写论文）出发，配置 VS Code，实现 Markdown 文本编辑器、Python IDE 和 LaTeX 编辑器三位一体综合体验，VS Code 的优点可以概括为：
    • 插件系统极其完善，配置简单，可玩性高。
    • 可通过 Microsoft / GitHub 账号实现插件和配置多设备同步。
    • GitHub Copilot 神器，响应极快，可以大大提升写代码的效率。

引言

什么是文本编辑器？什么是 IDE？VS Code 是文本编辑器还是 IDE？

  • 文本编辑器是一种用来编辑文本文件的工具，它通常只提供基本的文本编辑功能，比如插入、删除、复制和粘贴等操作。常见的文本编辑器有 Notepad、Sublime Text、Vim 和 Atom 等。
  • IDE（Integrated Development Environment ，集成开发环境）是一种软件应用程序，提供了更全面的功能来开发软件。除了文本编辑功能外，IDE 还集成了编译器、调试器、自动补全、代码提示、版本控制等功能，以帮助开发者更高效地编写、调试和管理代码。常见的 IDE 有 Visual Studio、Eclipse 和 IntelliJ IDEA 等。
  • VS Code（Visual Studio Code）最初被设计为一款轻量级的文本编辑器，但经过扩展和插件的支持，它也具备了许多 IDE 的功能。 VS Code提供了丰富的功能，如代码高亮、语法检查、自动补全、调试器、版本控制等，使开发者能够更方便地编写和调试代码。此外，VS Code 还支持各种编程语言的插件扩展，使其更加适用于不同的开发需求。虽然 VS Code 可以提供许多 IDE 的功能，但由于其轻量级设计，相比较于一些全功能的 IDE，可能会缺少一些高级功能和集成开发环境的深度集成。因此，我们可以将VS Code看作是介于文本编辑器和IDE之间的一种工具。

作为一名研究生，工作中必不可少的三个场景是：记笔记、写代码和写论文（包括 Beamer 汇报文档），需要一个趁手的编辑器来满足各项需求。经过长时间的探索体验之后，VS Code 以其出色插件系统和可高度自定义的特性脱颖而出，最后将其定制化为一站式编辑利器。

VS Code 最基础的安装与了解，在本文中不作详细介绍，大家可以稍微查看一下官方的说明文档，以下内容需要读者了解如何在插件市场中安装插件以及打开 settings.json 和  keybindings.json 文件，本文的教程只需要粘贴对应代码到这两个文件即可实现。

 
  • 打开 settings.json 文件：按下 Ctrl + Shift + P，然后选择 “Preferences: Open User Settings (JSON)”。
  • 打开 keybindings.json 文件：按下 Ctrl + Shift + P，然后选择 “Preferences: Open Keyboard Shortcuts”。
  • 或者通过左下角齿轮图标进入。

VS Code 中使用 Terminal

  • 开启/关闭终端快捷键 (Ctrl + `)
  • 切换默认终端为 PowerShell，并设置 Nerd 字体
# 在 settings.json 中添加如下配置
"terminal.integrated.defaultProfile.windows": "PowerShell", // 设置默认终端为 PowerShell
"terminal.integrated.fontFamily": "CaskaydiaCove Nerd Font Mono", // 设置终端字体
"terminal.integrated.fontSize": 14, // 设置终端字体大小

VS Code 中使用 Vim

 

熟悉 Vim 操作的读者，安装完了 VS Code 的第一件事应该就是配置 Vim 插件了，Vim 插件安装完成后，可以按照自己的习惯，将Esc键映射为jj, jk, kk.

# 在 settings.json 中添加如下配置
"vim.insertModeKeyBindings": [
  {
    "before": ["j","k"],
    "after": ["<Esc>"]
  }
],

VS Code 中使用 Neovim

 

如果有读者想在 VS Code 中使用本地的 Neovim 配置，则需要按以下流程配置：

  • 安装 vscode-neovim 插件
  • 安装 Neovim，在 vscode-neovim 插件中设置 Neovim 的完整路径
  • 配置 Neovim config 文件，在 Neovim 的 init.lua 文件中添加如下内容
# 在 Neovim 的 init.lua 文件中添加如下内容
if vim.g.vscode then
    -- VSCode extension
else
    -- ordinary Neovim
end
  • VS Code 中设置 Esc 键位映射为 jk, jj, kk .
# 在 keybindings.json 中添加如下内容
{
    "command": "vscode-neovim.compositeEscape1",
    "key": "j",
    "when": "neovim.mode == insert && editorTextFocus",
    "args": "j"
},
{
    "command": "vscode-neovim.compositeEscape2",
    "key": "k",
    "when": "neovim.mode == insert && editorTextFocus",
    "args": "k"
}

VS Code 配置 Markdown 编辑器

 

安装 Markdown Preview Enhanced 插件使用即可，入门使用无需配置。

通过安装 Markdown 扩展，我们可以享受到实时预览、语法高亮、自动补全等功能，让我们能够更轻松地编写和编辑 Markdown 文档。无论是写博客、技术文档还是做笔记，VS Code 都能成为我们的得力助手。

VS Code 配置 Python 开发环境

 

在 VS Code 中，我们可以通过安装 Python 扩展来获得对 Python 的全面支持，Python 扩展提供了语法检查、代码高亮、代码调试、代码自动补全等特性，其配置流程如下：

1.安装 Conda 并将其路径加入系统环境变量，配置环境变量流程如下（关于“Python 开发环境管理”管理的详细流程，可以参见我的上一篇文章）：

 
  • 设置中搜索“高级系统设置”
  • 点击“环境变量”
  • 在“系统变量”的 PATH 项下添加 Miniconda/Anaconda 安装路径

2.安装 Python 插件，安装 Python 插件时，VS Code 会直接打包安装配套的 Python 开发插件。

 

3.安装 Code Runner 插件，使用 Code Runner 可实现运行时自动保存文件，修改 VS Code 的 settings.json 文件，添加如下内容：

# 在 settings.json 中添加如下配置
"code-runner.executorMap": {
    "python": "$pythonPath -u $fullFileName",
},

VS Code 配置 LaTeX 编辑器

 

对于需要处理数学公式和写论文的人来说，LaTeX 是不可或缺的工具。通过安装 LaTeX Workshop 扩展，可以在 VS Code 中轻松编写和编译 LaTeX 文档。这个扩展提供了实时预览、自动补全、错误检查等功能，让我们在编写复杂的数学公式和排版复杂的科技论文时更加高效,其配置流程如下：

1.安装 TeXLive 发行版

安装 TeXlive 很简单，直接安装即可，安装过程中会自动设置 PATH，安装完了就可以直接使用。TeXlive安装完了非常干净，删除的时候直接文件夹删了就可以了，如果是更换安装路径，直接把文件夹剪切到目标路径，然后更新 PATH 就可以了，不用卸载重新安装。

2.安装 LaTeX 插件

安装 LaTeX Workshop 及一系列插件, 直接安装以下插件：LaTeX Workshop，LaTeX language support 和 Unicode Latex。

3.配置 settings.json 文件

// 设置外部PDF预览器
"latex-workshop.view.pdf.viewer":"external",
"latex-workshop.view.pdf.ref.viewer":"external",
"latex-workshop.view.pdf.external.viewer.command": "C:\\Users\\xxxxx\\AppData\\Local\\SumatraPDF\\SumatraPDF.exe",
"latex-workshop.view.pdf.external.viewer.args": [
 "%PDF%"
],
// 配置Syntex的正向与反向搜索(Latex->PDF)
"latex-workshop.view.pdf.external.synctex.command": "C:\\Users\\xxxxx\\AppData\\Local\\SumatraPDF\\SumatraPDF.exe",
"latex-workshop.view.pdf.external.synctex.args": [
 "-forward-search",
 "%TEX%",
 "%LINE%",
 "-reuse-instance",
 "-inverse-search",
 "\"C:\\Users\\xxxxx\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe\" \"C:\\Users\\xxxxx\\AppData\\Local\\Programs\\Microsoft VS Code\\resources\\app\\out\\cli.js\" -r -g \"%f:%l\"",
 "%PDF%" // 这里其实就是配置的反向搜索 不用在 Sumatra PDF 里面重新设
],
"latex-workshop.view.pdf.internal.synctex.keybinding": "double-click",
// Latex End
  • 正向搜索是在目标位置使用快捷键 Ctrl+Alt+J
  • 反向搜索是直接双击即可

当我们搜索 VS Code 中 的 LaTeX 配置教程的时候，网上现有大多数教程都给我们提供了一长串的编译链，实际上是没有这个必要的，因为不论是在哪个系统环境下，主流的发行版都带有 Latexmk 这一简化编译流程的工具。

latexmk
Latexmk 简介

LaTeX 使用的几点经验

  • 在配置文件 settings.json 文件中，路径最好使用转义字符。
  • LaTeX 文件夹目录第一个字符需要是字母，不可以是数字，路径可以有空格。
  • 如果遇到编译时间太长的情况，可以删掉文件夹下的除了 .tex 文件的其他文件重新编译。
  • 如果编译一直不停止，可能是设置了保存时自动编译，所以会一直不停地编译。
# 在 settings.json 中添加如下配置
"latex-workshop.latex.autoBuild.run": "never"

进阶扩展：VS Code 设置 Snippets

 

Snippets 是一种代码片段，它可以极大地提高开发效率，Snippets 的一些用途和示例：

快速代码补全：通过输入特定的前缀，编辑器会自动补全为预定义的代码模板。例如，输入 desc 并按回车，就会自动补全为 describe('description', function () { })。

自定义模板：可以根据自己的需求定义 Snippets，以便在编写代码时快速插入常用的代码块。比如，如果经常编写 Vue 路由链接（<router-link>），可以创建一个 router-link 的 snippets，使其根据不同参数自动补全。

变量和占位符：Snippets 支持变量和占位符，可以在模板中使用 $1、$2 等来指定光标位置，或者设置默认值。例如，${1|A,B,C|}最帅 可以提供多个值供选择。

正则替换：可以对变量进行正则替换，以便根据文件名等动态生成代码。例如，${TM_FILENAME/(.*)List\\.vue/$1Detail/i} 可以从文件名中提取关键部分。

 

通过在 VS Code 中同时驾驭 Markdown、LaTeX 和 Python，我们能够更加高效地进行写作和开发工作。无论是写技术文章、撰写论文还是编写代码，我们都可以将这款编辑器作为我们的一站式编辑利器。其出色的功能和扩展生态系统为我们提供了一个统一的工作流，让我们能够更专注、更高效地实现我们的目标。

 

1
0