vscode 开发工具指南之你所不知道的强悍功能

高阳很捷迅

已于 2022-08-17 10:51:22 修改

阅读量1.8k

点赞数 2

分类专栏：后端开发文章标签： vscode 编辑器代码规范前端后端

于 2022-08-16 19:37:05 首次发布

本文链接：https://blog.csdn.net/weixin_43805705/article/details/126372960

版权

本文详细介绍了Visual Studio Code（VSCode）的各种强大功能，包括云备份配置、列编辑、递增插入、CSV和Markdown工具、命令区的实用技巧，以及前端开发中的Vetur插件和npm脚本管理。同时，还特别强调了针对后端开发的远程开发解决方案，帮助开发者提升开发效率。

摘要由CSDN通过智能技术生成

介绍Visual studio code的用法，结合实际开发需要，突出介绍一些强悍技能。无论是MacBook 还是Windows用户，它都能够实现快速文本编辑和markdown编写，让文本编辑进入高效模式。

1. 公共篇

1.1 云备份配置，一个json文件搞定

{
    "workbench.colorTheme": "Quiet Light",
    "workbench.startupEditor": "newUntitledFile",
    "workbench.iconTheme": "vscode-icons",
    "workbench.editor.enablePreview": false, //不使用预览打开

    // 避免每次窗口都被覆盖
    "window.openFoldersInNewWindow": "on",
    "window.restoreWindows": "none",
    "files.autoSave": "afterDelay",
    "files.autoSaveDelay": 60000,

    // "security.workspace.trust.untrustedFiles": "open",
    "security.workspace.trust.enabled": false,
  
  	//前端相关
    "[vue]": { //vuejs 格式化问题
        "editor.defaultFormatter": "octref.vetur"
    },
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "vetur.format.defaultFormatter.js": "prettier",
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap-attributes": "aligned-multiple",
            "wrap-attributes-indent-size": 4,
            "wrap-line-length": 150,
            "indent_size": 2, //两个空格位置
        },
        "prettier": {
            "tabWidth": 2, //两个空格位置
            "printWidth": 200,
            "singleQuote": false,
            "jsxBracketSameLine": true,
        },
    },
 
    "[javascript]": {    //JavaScript 格式化问题
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    &#