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"
  },
  // ******************插件扩展设置******************
  //liveserver默认浏览器:谷歌
  "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.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"
  }
  // ******************保存setting.json******************
}

プラグインの推奨事項

  • ライブサーバー
    リアルタイムウェブサーバー

  • カラーハイ
    ライトハイライトカラー

  • ブラケットペアカラーライザー2
    色ブラケット

  • パスIntellisenseは
    自動的にパスを完成させます

  • HTMLからCSSへのオートコンプリートの
    アウトオブラインプロンプトクラス名ID

  • css-class-intellisense
    インラインプロンプトクラス名ID


  • 英語のコードの意味分析します


  • タグの自動名前変更タグを同期的に変更する</>

  • EasyLESS
    はcssをすばやくコンパイルします

  • ESLlint

  • 画像プレビュー
    プレビュー画像
    PHPIntelliSensePHP
    コードヒント

  • 1つのダークプロ
    テーマカラー

  • マテリアルアイコンテーマ
    ファイルアイコンテーマ

  • インデント-レインボー
    スペース表示

  • Prettier-フォーマット
    されたコードフォーマッター

おすすめ

転載: blog.csdn.net/bealei/article/details/115053914
おすすめ