VScode插件推荐和基本配置

插件推荐

• Live Server
  实时网络服务器

• Color Highlight
  高亮显示颜色

• Bracket Pair Colorizer 2
  彩色括号

• Path Intellisense
  自动补全路径

• HTML to CSS autocompletion
  外联式提示类名id

• css-class-intellisense
  内联式提示类名id

• 会了吧
  分析代码英文含义

• Auto Rename Tag
  同步修改标签</>

• Easy LESS
  快速编译css

• ESLlint

• Image preview
  预览图片
  PHP IntelliSense
  PHP代码提示

• One Dark Pro
  主题颜色

• Material Icon Theme
  文件图标主题

• indent-rainbow
  空格显示

• Prettier - Code formatter
  格式化

• Markdown Preview Enhanced
  MarkDown在VScode编辑时，侧边预览功能

基本配置

{
  //******************系统默认设置******************
  //颜色主题
  "workbench.colorTheme": "One Dark Pro",
  //文件图标
  "workbench.iconTheme": "material-icon-theme",
  //字号
  "editor.fontSize": 20,
  // 重新设定tab为两个空格
  "editor.tabSize": 2,
  //保存自动格式化
  "editor.formatOnSave": true,
  //配置文件关联语言
  "files.associations": {
    // "*.php": "html",
    // "*.html": "php",
    // "*.vue": "html"
  },
  // ******************插件扩展设置******************
  //live server插件设置默认浏览器：谷歌
  "liveServer.settings.CustomBrowser": "chrome",
  //prettier插件格式化代码
  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[css]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[less]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  //PHP可执行的设置php安装的所在路径
  "php.validate.executablePath": "D:/phpstudy/Extensions/php/php7.3.4nts/php.exe",
  //自动补全路径
  "path-intellisense.showHiddenFiles": true,
  // PHP Intelephense格式化php代码
  "[php]": {
    "editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
  },
  //Open PHP/HTML/JS In Browser插件设置
  "open-php-html-js-in-browser.selectedBrowser": "Chrome",
  "open-php-html-js-in-browser.documentRootFolder": "D:\\phpstudy\\WWW"
  // ******************保存setting.json   49******************
}