vscode 常用设置

 

by:授客 QQ1033553122

 

版本

vscode Version: 1.33.1

 

1.   自动保存文件设置

文件编辑一秒钟过后自动保存

2.   黏贴后、保存完、输入完后自动化格式

3.   代码行可容纳字符数及换行设置

bounded 超过word Wrap Column设置的字符数、达到视口最小宽度,则换行

4.   tab键自动转为插入空格(默认就是勾选的)

 

5.   取消根据打开文件的内容自动设置Editor:Tab SizeEditor:insert Space的值

6.   插件安装与配置

Eslint插件安装(Javascript语法检测推荐使用)

一个javascript语法规则和代码风格的检查工具。

打开界面中,输入Eslint,搜索结果中点击install

插件配置

自动修复配置

Prettier - Code formatter插件安装

Prettier - Code formatter:只关注格式化,并不具有eslint检查语法等能力,只关心格式化文件(最大长度、混合标签和空格、引用样式等),包括JavaScript,Flow,TypeScript,CSS,SCSS,Less,JSX,GraphQL,JSON,Markdown。

注意:针对该插件,输入完自动格式化设置不起作用,需要按Ctrl+s才会格式,另外,似乎不支持Vue

插件配置

集成Eslint

tab空格数配置

去掉每行代码结尾的分号

设置每行可容纳字符数

Vetur插件安装(Vue格式化推荐使用)

支持格式化vue

插件配置

设置插件默认的格式化器

tab设置

vue-beautify插件安装(Vue格式化推荐使用)

7.   默认格式化器设置

选中要格式化的代码,按Alt+Shift+F,如下,未设置默认格式化器的时候,会弹出来以下提示,点击config

(搜索)选择要使用的格式化器(例子圈选部分),点击

当然,也可以右键选择Fortmation Selection With,打开以上界面

备注:Fortmation Selection 打开右下角的config提示

为了避免麻烦,我们可以设置我们安装的格式化插件为默认格式化器,该格式化插件会优先于其他格式化器被用于格式化,但是实践发现,当使用如下红色选框圈选时的格式化器作为默认格式化器时,格式化vue代码不起作用。解决方案是设置为null。个人理解,当设置为null时,会自动匹配最佳格式化器,然后格式化js文件时,按提示操作,再配置下默认格式化器就好

vscode 常用设置的更多相关文章

  1. vscode 常用设置与插件推荐

    1.Chinese (Simplified) Language Pack for Visual Studio Code 适用于 VS Code 的中文(简体)语言包 2.Color Info Visu ...

  2. webstorm vscode 常用设置

    webstorm常用的设置及操作图解 VS Code 新建vue文件初始化模板 VSCode新建vue文件自定义模板

  3. vscode常用设置

    1.代码提示快捷键设置:(keybindings.json) { "key": "ctrl+j","command": "edit ...

  4. vscode常用快捷键及常用设置

    快捷键 ctrl+b 切换侧边栏 ctrl+\ 拆分编辑器 ctrl+鼠标滚轮 缩放编辑器的字体 alt+shift+f 整理代码格式 alt+z 切换自动换行 ctrl+· 打开终端调试 ctrl+ ...

  5. linux云服务器常用设置

    前面的话 由于在云服务器上配置自己的网站,将Linux里的常用设置记录如下 更改shell 默认地, ubuntu系统默认的shell是dash,但更常用的shell是bash 通过下面命令可以将da ...

  6. VSCode常用插件之vscode-stylelint使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 vscode-stylelint这是一个检验CSS/SASS/LESS代码规范的插件. StyleLint 使用指南 vscode-style ...

  7. VSCode常用插件之ESLint使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 ESLint这是VS Code ESLint扩展,将ESLint JavaScript集成到VS Code中. 首先简单说一下使用流程: 1. ...

  8. VSCode常用插件之EditorConfig for vs code 使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 当大家在公司工作时,不可能永远是一个人维护一个项目,当多个人参与一个项目,每个人使用的编辑器不一样,代码风格自然也不一样,那么如何让使用不同编 ...

  9. vscode常用插件快捷键

    俗话说,工欲善其事必先利其器,我们码农的器是什么尼?没错,就是我们亲爱的IDE,前端开发者最爱的编辑器应该是vscode了吧.但是我们要怎么去锋利它尼?不外乎就是熟悉它的使用方法.快捷键以及第三方的插 ...

  10. vscode常用快捷键及插件

    macOS 全局 Command + Shift + P / F1 显示命令面板 Command + P 快速打开 Command + Shift + N 打开新窗口 Command + W 关闭窗口 ...

随机推荐

  1. 昇腾开发全流程 之 MindSpore华为云模型训练

    前言 学会如何安装配置华为云ModelArts.开发板Atlas 200I DK A2, 并打通一个训练到推理的全流程思路. 在本篇章,首先我们开始进入训练阶段! 训练阶段 A. 环境搭建 MindS ...

  2. HTML——结构和标签格式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Android 13 - Media框架(28)- MediaCodec(三)

    关注公众号免费阅读全文,进入音视频开发技术分享群! 上一节我们了解到 ACodec 执行完 start 流程后,会把所有的 input buffer 都提交给 MediaCodec 层,MediaCo ...

  4. NumPy 泊松分布模拟与 Seaborn 可视化技巧

    泊松分布 简介 泊松分布是一种离散概率分布,用于描述在给定时间间隔内随机事件发生的次数.它常用于模拟诸如客户到达商店.电话呼叫接入中心等事件. 参数 泊松分布用一个参数来定义: λ:事件发生的平均速率 ...

  5. FRDM-MCXN947开发板之i2c应用

    介绍 MCXN947 NXP FRDM-MCXN947开发板是一款基于MCXN947 MCU的低成本评估板,MCU集成了双核Arm Cortex-M33微控制器和一个神经处理单元(NPU).开发板由一 ...

  6. flutter 环境搭配 (一)

    首先下载flutter SDK Flutter中文网 官网 (p2hp.com 选择下载 SDK 解压后 ,添加到环境变量中. 配置国内镜像, PUB_HOSTED_URL=https://pub.f ...

  7. linux查看端口命令 lsof netstat

    [root@VM-4-3-centos /]# lsof -i:8881COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAMEnode 15526 roo ...

  8. aspose word模板文件生成pdf

    # aspose word模板文件生成pdf package com.example.core.mydemo; import com.alibaba.fastjson.JSON; import com ...

  9. SQLBI_精通DAX课程笔记_01_DAX介绍

    一:函数式语言 DAX是一个函数式语言,应用于Analysis Services , PowerPivot , 和Power Bi . 二:共同与不同 2.1  共同点 DAX与PowerPivot  ...

  10. 开启IPV6网络

    1.路由器开启IPV6支持 2.路由器关闭IPV6 DHCP服务 3.若外网无法访问则关闭路由器防火墙 或关闭系统防火墙 4.tomcat需设置地址为0.0.0.0