首页 > 其他分享 >VSCode:代码格式化插件

VSCode:代码格式化插件

时间:2024-12-02 09:30:52浏览次数:8  
标签:插件 格式化 esbenp VSCode defaultFormatter vscode editor true prettier

settings.json文件中添加如下配置并保存 

{
    "workbench.sideBar.location": "left",
    "cssrem.rootFontSize": 80,
    "git.ignoreWindowsGit27Warning": true,
    "eslint.codeAction.showDocumentation": {
      "enable": true
    },
    //改变注释颜色
    // "editor.tokenColorCustomizations": {
    //   "comments": "#ff4f81" // 注释
    // }, 
      
      //导入文件时是否携带文件的扩展名
      "path-autocomplete.extensionOnlmport": true,
      //配置@的路径提示
      "path-autocomplete.pathMappings": {
          "@": "${folder}/src"
      },
    //配置eslint
    "eslint.validate": ["javascript", "javascriptreact", "html", "vue"],
    // "eslint.run": "onSave",
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": "explicit"
    },
    "editor.mouseWheelZoom": true,
    "editor.minimap.renderCharacters": false,
    "debug.javascript.defaultRuntimeExecutable": {
      "pwa-node": "node"
    },
    "open-in-browser.default": "{\"open-in-browser.default\":\"Chrome\"}",
    "files.associations": {
      "*.cjson": "jsonc",
      "*.wxss": "css",
      "*.wxs": "javascript"
    },
    "emmet.includeLanguages": {
      "wxml": "html"
    },
    "minapp-vscode.disableAutoConfig": true,
    "[python]": {
      "editor.formatOnType": true
    },
    "editor.detectIndentation": false,
    "explorer.compactFolders": false,
    // html使用prettier格式化
    "[html]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[vue]": {
      // "editor.defaultFormatter": "Vue.volar"
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[typescript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    // json使用prettier格式化
    "[json]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[jsonc]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "editor.tabSize": 2,
    "[scss]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "px2rem.rootFontSize": 64,
    "px2rem.autoRemovePrefixZero": false,
    "editor.formatOnSave": true // 保存时自动规范代码
  }

然后重启工具,当保存的时候就会自动格式化~~

标签:插件,格式化,esbenp,VSCode,defaultFormatter,vscode,editor,true,prettier
From: https://blog.csdn.net/yao_guai/article/details/144097444

相关文章

  • 基于Bootstrap的Material Design风格表单插件
    JqueryMaterialFormPlugin是一款基于Bootstrap的MaterialDesign风格的JQUERY表单插件。该表单通过自定义样式和jQuery来将Bootstrap的表单修改为扁平风格的表单,并带有浮动标签特效。在线演示  下载  使用方法使用该MaterialDesign风格表单需要在页面中引入jquery,bo......
  • 如果让你把把html页面导出为pdf,不用插件的话,你该怎么做?
    如果不用插件,在前端将HTML页面导出为PDF,主要有以下几种方法:利用浏览器自带的打印功能转换为PDF:这是最简单的方法。大多数现代浏览器都支持将页面打印成PDF。可以通过JavaScript调用window.print()来触发打印对话框,然后用户可以选择将输出目标设置为PDF。优点......
  • 写一个让一句话随着鼠标移动的小插件
    //创建一个div元素来容纳文本constfloatingText=document.createElement('div');floatingText.style.position='fixed';//使其相对于视口定位floatingText.style.pointerEvents='none';//避免干扰鼠标事件floatingText.textContent='这是一句会跟随鼠标移动的......
  • AI编程助手(插件)
    1前言基于AI大模型,在vscode等编程工具中使用一些插件能提供代码智能生成与补全、代码与思路问答、代码优化、代码解释等功能这一篇主要以阿里的通义灵码为例进行说明2通义灵码在vscode中辅助编程1文档及安装项目文档:https://help.aliyun.com/zh/lingma/product-overview/i......
  • VSCode修改资源管理器文件目录树缩进(VSCode目录结构、目录缩进、文件目录外观)workbenc
    文章目录方法点击左下角小齿轮点击设置点击工作台,点击外观,找到Tree:Indent设置目录树的缩进方法点击左下角小齿轮点击设置点击工作台,点击外观,找到Tree:Indent设置目录树的缩进"workbench.tree.indent"默认值为8,我给改成40了:"workbench.tree.indent":40......
  • 用VsCode优雅写MarkDown
    插件推荐MarkdownAllinOne快捷键作用Ctrl+B加粗Ctrl+I斜体Alt+S删除线Ctrl+]增加缩进Ctrl+[减少缩进Ctrl+Shift+]标题升级Ctrl+Shift+[标题降级Alt+C勾选/取消勾选任务列表Ctrl+M数学环境Alt+Shif......
  • 【Unity 水面着色器插件】Stylized Water Toon Shader - Mobile Ready 专为低性能平台
    StylizedWaterToonShader-MobileReady是一款为Unity开发者设计的水面着色器插件,专为低性能平台(如移动设备)优化,提供高质量的卡通风格水面效果。该插件通过简化的渲染方式和丰富的视觉效果,使开发者能够在移动端或其他性能受限的平台上实现流畅的水面表现,适用于多种游戏......
  • 【Unity 特效插件】Trails FX 帮助开发者在游戏中实现物体移动时产生的尾迹效果
    TrailsFX是一款专为Unity开发者设计的特效插件,用于创建动态的尾迹效果(TrailEffects)。这款插件提供了一种快速而高效的方式,帮助开发者在游戏中实现物体移动时产生的尾迹效果,如快速移动的物体、飞行物、粒子效果等。无论是用于角色技能、武器攻击、物体轨迹,还是火焰、光影......
  • 【Unity 战斗插件】ABC Integration: Game Creator 2
    ABCIntegration:GameCreator2是一个为GameCreator2框架开发的插件,旨在将ABC(Action-BasedCombat)系统与GameCreator2集成。ABC是一个专注于动作战斗的系统,它可以轻松地让开发者为自己的游戏添加复杂的战斗机制、攻击动作和技能系统。通过该插件,开发者能够快......
  • Liunx如何连接虚拟机、Xshell、vscode
    1.免费的linux的安装VMware被博通收购之后,官方将这两个产品对个人使用完全免费。官方推出了最新版本WorkstationPro17.5.2和FusionQPro13.5.2。步骤一:首先要注册一个博通账号,我用的QQ邮箱注册的,没什么问题,只要能够登录就好步骤二:下载链接地址:https://support.broadcom......