vscode配置

Posted by Hsz on February 10, 2018

Vscode

我现在的主力编辑器是Vscode,这个编辑器没有atom那么花哨,但快太多了,安装插件的方式也相当友好.本文将介绍我是如何配置Vscode的.

我主要使用的是Python和C,偶尔使用下前端开发的语言,因此除了同用的配置外还会介绍这两种语言的配置方式.

本文初稿在2018年2月发布,现在已经过去将近一年,又出现了一些好用的插件,因此做一个更新.

插件安装和使用方式

vscode插件是图形化安装的,在左侧的插件按钮用于搜索和安装插件.

vscode的插件管理

插件的使用是使用ctrl+p组合键呼出菜单,输入>+对应的插件名+对应的操作就可以使用了. 听起来很不好用,但其实一路有提示,可以选择提示中的操作执行,实际体验其实比图形化的按还要好些.

通用配置

有一些配置是无论使用什么语言都需要做的比如设置主题,设置合作编码工具,以及一些功能性的插件.

设置主题

vscode原始界面比较丑,可以通过安装主题插件改善,我比较喜欢的主题是Solarzed-darkSolarzed-light. 更推荐后者,草黄色的底色相对比较护眼.

选择主题的路径是文件->首选项->颜色主题,在其中选择即可

用户设置

vscode的设置界面 用户设置的路径是文件->首选项->设置,vscode的设置实际上就是编译一个json文件,右侧为默认配置,左侧为用户配置,左侧找到要修改的条目位置点击最左侧小铅笔就会将对应条目复制到左侧用户设置部分进行编辑.

安装通用插件

  • vscode-icons

    vscode的图标库

  • Chinese (Simplified) Language Pack for Visual Studio Code

    官方的中文语言包

  • Project Manager(已被vscode整合)

    项目管理插件,可以将一个文件夹保存为项目方便管理

  • Terminal

    在下方增加控制台按钮可以在页面下部呼出控制台界面,其中包含终端,windows下默认使用powershell

  • Visual Studio Team Services

    使Vscode左边栏的代码管理按钮可以和git工具结合方便团队协作

  • GBKtoUTF8

    跨平台工具,方便将GBK编码的把内容转变为utf-8

  • Bracket Pair Colorizer

    为括弧类的着色,便于分辨

  • Bookmarks

    选中一行后就可以右键设置书签的插件,要在书签间切换只要使用简单好用,然后用ctrl+alt+L+或者ctrl+alt+J执行书签间的跳转.

  • Markdown Extension Pack

    一个markdown的扩展包,几乎包含了所有有用的markdown相关插件.注意要展示latex数学公式需要额外安装node包:

    • markdown-it
    • katex
    • clipboardy
  • Markdown Preview Github Styling

    github风格的markdown展示

  • Path Intellisense

    自动完成地址补完

  • Docker

    docker语法高亮和管理工具

Python相关插件及其设置

python相关的插件需要安装一部分python工具作为依赖

  • isor用于重新排列import的依赖
  • pylint用于检测代码风格
  • pep8用于检测代码风格是否满足pep8风格
  • autopep8用于自动将代码转换成pep8风格
  • ptvsd用于远程调试远端服务器上的代码

安装插件

  • autoDocstring

    用于自动生成python的docstring

  • python

    官方的python插件,简单实用

  • Cython(Language-Cython)

    Cython语法高亮

  • Jinja(Better Jinja)

    jinja语法高亮

设置python的语法工具(update @2019-2-12)

"python.venvPath": "${workspaceRoot}/env",
"python.linting.mypyEnabled": false,
"python.linting.pylintEnabled": false,
"python.linting.pep8Enabled": true,
"python.linting.pep8Args": [
    "--max-line-length=140",
    "--indent-size=4",
    "--ignore=E501"
],
"python.linting.pydocstyleEnabled": true,
"python.linting.pylintArgs": [
    "--include-naming-hint=n",
    "--max-line-length=140",
    "--disable=W0311",
    "--disable=C0103",
    "--disable=E1101",
    "--disable=C0111",
    "--disable=W0621",
    "--disable=wildcard-import",
    "--enable=W0614"
],
"python.formatting.autopep8Args": [
    "--max-line-length=140",
    "--indent-size=4",
    "--ignore=E501"
],
"python.sortImports.args": ["-rc", "--atomic"],
"python.unitTest.unittestEnabled": true,
"autoDocstring.docstringFormat": "google

C语言相关插件及其设置

安装插件

  • C/C++

    官方语言插件,简单好用

  • cpplint

    c/c++的语法检查插件

  • Include Autocomplete

    C/C++ 头文件管理

  • Arduino

    vscode上的Arduino扩展

设置C/C++语法工具

"cpplint.cpplintPath": <path>,
"C_Cpp.clang_format_fallbackStyle": "Google",
"C_Cpp.clang_format_style": "{ BasedOnStyle: Google, IndentWidth: 4 }"

“cpplint.cpplintPath”用于指定cpplint的位置,cpplint是一个python工具,可以使用pip安装

前端相关插件及配置

安装插件

  • Auto Rename Tag

    自动为html中对应的关闭标签改名

  • Auto Close Tag

    为html格式自动添加对应封闭的插件

  • JavaScript (ES6) code snippets

    es6工具

  • ESLint

    jsde 语法检查工具

  • Vetur

    vue2的语法高亮

  • Beautify

    美化javascript, JSON, CSS, Sass, 和HTML的代码格式

  • jekyll syntax package

    jekyll语法高亮

远程项目

  • Remote Workspace(new @2019-2-12)

    用于直接编辑远程机器上的文件.支持多种协议.以sftp协议为例. 使用方法:

    1. 在合适的位置新建一个[name].code-workspace文件,name部分随便取.其内容为:

       {
           "folders": [{
               "uri": "sftp://my-user:my-password@example.com/home/pi/?debug=1",
               "name": "My SFTP folder"
           }]
       }
      
    2. 文件->打开工作区中打开这个.code-workspace文件等一会儿就可以打开了.