vscode配置之Vue开发者极度舒适的自定义配置

原创已于 2024-04-09 18:50:25 修改 · 800 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #vscode #经验分享 #编辑器

于 2024-04-09 10:13:43 首次发布

杂七杂八专栏收录该内容

26 篇文章

订阅专栏

文章详细描述了如何自定义VisualStudioCode编辑器的颜色主题，包括关键字、注释、变量等不同类型的高亮，以及GitLens快捷键的跳过确认和Git命令配置。同时提及了ESLint的自动修复功能和commit消息中使用emoji的设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

很喜欢的一套颜色配置，记录一下。

  // 自定义的颜色
  "editor.tokenColorCustomizations": {
    "comments": "#55aa7f", // 注释
    "keywords": "#ff55ff", // 关键字
    "variables": "#a792e2", // 变量名 
    "strings": "#00ff7f", // 字符串
    "functions": "#ffff00", // 内置函数名
    "numbers": "#00eeff", // 数字
    "types": "#55bbff", //类定义颜色
    //其他具体的颜色设置
    "textMateRules": [ 
      {
          "scope": "keyword.control",//if ,else, try 等控制符
          "settings": {
              "foreground": "#C586C0"
          }
      },
      {
          "scope": "keyword.operator",//算数符
          "settings": {
              "foreground": "#f05c07"
          }
      },
      {
          "scope": "storage.modifier",//修饰语
          "settings": {
              "foreground": "#f78484"
          }
      },
      {
          "scope": "entity.name.type.class",//类名
          "settings": {
              "foreground": "#c0526a"
          }
      },
      {
          "scope": "storage.type.primitive.java",//定义 Java 语言中原始数据类型（如 int, float, char 等）的文本颜色范围
          "settings": {
              "foreground": "#c0526a"
          }
      },
      {
          "scope": "entity.name.type.interface",//接口
          "settings": {
              "foreground": "#c0526a"
          }
      },
      {
          "scope": "entity.name.namespace",//导入部分
          "settings": {
              "foreground": "#74817c"
          }
      },
      {
          "scope": "entity.name.tag",//html标签
          "settings": {
              "foreground": "#3284ca"
          }
      }
    ]
  },
  
  "gitlens.gitCommands.skipConfirmations": [
    "fetch:command",
    "stash-push:command",
    "switch:command",
    "push:command"
  ],

  "Codegeex.Privacy": true,
  "Codegeex.Comment.LanguagePreference": "中文",
  "Codegeex.Explanation.LanguagePreference": "中文",
  "Codegeex.SidebarUI.LanguagePreference": "中文",
  "terminal.integrated.env.windows": {},

  //配置Eslint自动修复并保存代码
  "editor.codeActionsOnSave": {
    

    "source.fixAll.eslint": true,
    "eslint.autoFixOnSave" : true,
  },
  // "workbench.colorTheme": "Visual Studio Dark", //注释掉这行，否则有些代码会是白色的！

还挺喜欢commit信息emoji的配置

  // 配置commit时的emoji
  "individualEmoji.specified.enable": true,
  "individualEmoji.specified.typeConfig": [
    /* override default this type config ['feat', ['✨']]
       可以使用["🌸", "🌈"]，表示随机插入其中一个emoji */
    ["feat", ["🌸"]], // 添加新功能
    ["fix",["🐛"]], // 修复bug
    ["chore", "🔥"], // 移除代码或文件
    ["style", ["🎨"]], // 改进代码结构或格式
    ["pref", ["⚡️"]], // 性能优化
    ["docs", ["📝"]], // 增加或更新文档
    ["comment", ["💡"]], // 增加/更新源代码中的注释
    ["rename", ["🚚"]], // 移动/重命名文件/路径
    ["build", ["🚀"]], // 构建和部署功能
    ["test", ["✅"]], // 增加/更新测试用例
    ["release", ["🔖"]], // 发行版本标签
    ["revert", ["⏪️"]], // 回退
    ["refactor", ["♻️"]], // 重构代码
    ["merge", ["🔀"]], // 合并分支
    ["tada", ["🎉"]], // 开始一个项目
    ["config", ["🔧"]], // 增加或更新配置文件
    ["typos", ["✏️"]], // 修改错别字
    ["package", ["📦️"]], // 增加/更新编译后文件/包
  ]