VS Code 介绍

VS Code 是微软开发并维护的一款代码编辑器,几乎支持所有主流编程语言的代码高亮、智能提示。具备诸多优良的特性:

======= 「分分钟上手 VS Code」基本使用指南 – 艾逗笔个人博客

「分分钟上手 VS Code」基本使用指南

🕓 · ☕2 min read
🏷️
  • #vscode
  • VS Code 介绍

    VS Code 是微软开发并维护的一款代码编辑器,几乎支持所有主流编程语言的代码高亮、智能提示。具备诸多优良的特性:

    >>>>>>> 88cd131d189d9d876938cf7072c5049d5300cb56
    • 轻量级。
    • 免费开源。
    • 跨平台。
    • 丰富的扩展。
    • 良好的性能。
    <<<<<<< HEAD

    VS Code 使用

    VS Code 安装扩展

    下面三种方式都可以进入扩展安装面板:

    =======

    VS Code 使用

    VS Code 安装扩展

    下面三种方式都可以进入扩展安装面板:

    >>>>>>> 88cd131d189d9d876938cf7072c5049d5300cb56
    1. 选择 Code>Preferences>Extensions
    2. 使用快捷键 shift+command+X (推荐)
    3. 使用快捷键 shift+command+P 进入命令面板,输入 Extensions: Install Extensions
    <<<<<<< HEAD

    搜索扩展并进行安装:

    VS Code 自定义代码片段

    选择 Code>Preferences>User Snippets 或使用快捷键 shift+command+P 进入命令面板,输入 Preferences: Configure User Snippets 进行自定义代码段的管理。

    点击 New Global Snippets file... 新建自定义代码段:

    custom.code-snippets

    {
        "Author Info": {
            "scope": "php,go",
            "prefix": "author",
            "body": [
                "/**",
                "* $1",
                "* @author 艾逗笔<http://idoubi.cc>",
                "*/",
                "$2"
            ],
            "description": "Author Infomartion"
        }
    }
    

    上述自定义代码配置保存后,在 phpgo 文件中输入 author 即可生成自定义的代码段。

    VS Code 自定义快捷键

    输入快捷键 command+K command+S,进入快捷键设置界面。搜索关键词寻找指令,点击左侧的修改按钮,绑定自定义的快捷键。

    也可以在 keybindings.json 中直接修改:

    // Place your key bindings in this file to overwrite the defaults
    [
        {
            "key": "cmd+l",
            "command": "workbench.action.toggleSidebarVisibility"
        },
        {
            "key": "cmd+b",
            "command": "-workbench.action.toggleSidebarVisibility"
        }
    ]
    

    VS Code 自定义配置参数

    输入快捷键 command+,,进入配置页面,搜索关键词调整配置参数。

    也可以在 settings.json 中编辑自定义的配置:

    {
        "editor.fontSize": 14, // 字体大小
        "editor.formatOnSave": true, // 保存时自动格式化
        "files.autoSave": "onFocusChange", // 失去焦点时自动保存文件
        "breadcrumbs.enabled": true, // 显示文件路径
        "window.zoomLevel": 0, // 窗口缩放比例
        "workbench.statusBar.visible": true, // 隐藏底部状态栏
        "workbench.colorTheme": "An Old Hope Italic" // 编辑器主题
    }
    

    VS Code 自定义主题

    对于一个对颜值有要求的开发者,我们希望能够根据自己的喜好定制编辑器的颜色主题。VS Code 内置诸多不同风格的编辑器主题,输入快捷键 command+K command+T 弹出主题选择界面,可以选择自带的主题。也可以在扩展中心安装第三方主题后再在这里启用。