VSCode编译器

# 常用插件

Material Theme编译器外观主题插件。
Perttier - Code formatter代码格式器，记得，设置VSCode编译器的Format On Save自动保存并格式化

Prettier失效问题(vscode右下角是否有Prettier√)：在vscode中，右键选择“使用…格式化文档”，确认默认格式化程序，即可！解决多个格式化程序冲突，导致Prettier失效的问题。

需要创建.prettierrc 文件覆盖本地配置：
{ 
  "printWidth": 80, // 每行代码长度（默认80）
  "tabWidth": 2, // 每个tab相当于多少个空格（默认2）
  "useTabs": false, // 是否使用tab进行缩进（默认false）
  "singleQuote": true, // 使用单引号（默认false）
  "semi": true, // 声明结尾使用分号(默认true)
  "trailingComma": "all", // 多行使用拖尾逗号（默认none）
  "bracketSpacing": true, // 对象字面量的大括号间使用空格（默认true）
  "jsxBracketSameLine": false, // 多行JSX中的>放置在最后一行的结尾，而不是另起一行（默认false）
  "arrowParens": "avoid" // 只有一个参数的箭头函数的参数是否带圆括号（默认avoid）
  "endOfLine": "auto"// <lf|crlf|cr|auto> lf仅\n换行、"crlf"-回车符+换行符（\r\n）
};



需要创建.prettierignore文件忽略要格式化的文件
# 忽略全部css文件，但是border.css除外
*.css
!border.css

# 忽略commons.js的格式化。手动维护
common.js

Bracket Pair Colorizer颜色括号，方便查看代码。
Auto Rename Tag自动重命名HTML标签，提升工作效率。
CSS peek快速查找CSS样式类，提升工作效率。
Live Server本地服务器运行HTML文件。
javascript console utils快速生成console.log()，节省时间；ctrl+shift+[L | D]
JavaScript Snippet Packjs语法缩写，例如：“cl > console.log()”

---

---

---

非必备插件

Power Mode: 打字特效，纯属娱乐、解乏。

// 首选项 > 设置，搜索todo-tree > setting.json
"powermode.enabled": true,
"powermode.presets": "fireworks",
"powermode.enableShake": false

Todo Tree: 代办树，用于标记等待处理、BUG等文件，提升工作效率。

// 首选项 > 设置，搜索todo-tree > setting.json
{
    "todo-tree.highlights.defaultHighlight": {  // 默认标签
        "icon": "alert",  // 图标
        "type": "text",  // 注释类型
        "foreground": "#d9bac2",  //  文字颜色
        "background": "#902034",  // 背景色
        "opacity": 50,
        "iconColour": "#a2041e" // 图标颜色
    },
    "todo-tree.highlights.customHighlight": {  // 定制标签
        "BUG": {
            "icon": "bug"
        },
        "TODO": {  
            "icon": "flame",
            "iconColour": "#ffd205"
        }
    }
}