VS Code Settings


Posted by s1101192101 on 2021-05-10

IDE Theme & Font

- Font

  • Fira Code GitHub
  • # monospaced # multi-character combinations


- Theme (As Extensions)

  • One Dark Pro GitHub
  • # based on Atom's default One Dark theme


  • Material Icon Theme GitHub

  • #Material folder icons & file icons



Extensions

- Common

  • DotENV GitHub
  • #.env syntax highlighting


  • Better Comments GitHub

  • #comments highlighting


  • SFTP GitHub

  • #Syncs local directory & remote server directory

- HTML&XML

  • Auto Close Tag GitHub
  • #Automatically add HTML/XML close tag

  • XML Tools GitHub
  • #XML Formatting / Tree View #XPath Evaluation #XQuery Linting / Execution / Code Completion

- JavaScript

  • ESLint GitHub

  • Pretter GitHub
  • #Opinionated code formatter

  • Lodash GitHub
  • #Lodash snippets

- CSS

- Vue

- Php

- Git


Settings

# settings.json
{
    // * EDITOR

        // THEME
        "workbench.iconTheme": "material-icon-theme",
        "workbench.colorTheme": "One Dark Pro",

        // FONT
        "editor.fontFamily": "Fira Code",
        "editor.fontLigatures": true,
        "editor.fontSize": 11,

        // FORMATTER
        "editor.formatOnSave": true,
        // "editor.formatOnPaste": true,
        "editor.codeActionsOnSave": {
            "source.fixAll": true,
            "source.fixAll.eslint": false
        },

        // OTHER
        "editor.multiCursorModifier": "ctrlCmd",
        "editor.snippetSuggestions": "top",


    // * FRONT-END

        // ES LINT
        "eslint.debug": true,
        "eslint.format.enable": true,

        // VETUR
        "vetur.format.defaultFormatter.css": "none",
        "vetur.format.defaultFormatter.html": "none",
        "vetur.format.defaultFormatter.js": "none",
        "vetur.format.defaultFormatter.less": "none",
        "vetur.format.defaultFormatter.postcss": "none",
        "vetur.format.defaultFormatter.pug": "none",
        "vetur.format.defaultFormatter.sass": "none",
        "vetur.format.defaultFormatter.scss": "none",
        "vetur.format.defaultFormatter.stylus": "none",
        "vetur.format.defaultFormatter.ts": "none",
        "vetur.format.enable": false,

        // PRETTIER
        "prettier.enableDebugLogs": true,
        "prettier.endOfLine": "crlf",
        "prettier.singleQuote": true,
        "prettier.vueIndentScriptAndStyle": true,


    // * BACKEND

        // PHP-CS
        "php-cs-fixer.executablePath": "${extensionPath}/php-cs-fixer.phar",
        "php-cs-fixer.lastDownload": 1619589313518,
        "php-cs-fixer.onsave": true,
        "php-cs-fixer.autoFixBySemicolon": true,


    // * CONFIGURE BY FILE TYPE

        // PHP
        "[php]": {
            "editor.defaultFormatter": "junstyle.php-cs-fixer"
        },

        // VUE
        "[vue]": {
            "editor.defaultFormatter": "esbenp.prettier-vscode"
        },

        // HTML
        "[html]": {
            "editor.defaultFormatter": "esbenp.prettier-vscode"
        },

        // JAVASCRIPT
        "[javascript]": {
            "editor.defaultFormatter": "esbenp.prettier-vscode"
        },

        // TYPESCRIPT
        "[typescript]": {
            "editor.defaultFormatter": "esbenp.prettier-vscode"
        },

        // JSON
        "[json]": {
            "editor.defaultFormatter": "vscode.json-language-features"
        },

}

#VS Code #ide







Related Posts

[Oracle SQL Debug] 解決ORA-01489的問題

[Oracle SQL Debug] 解決ORA-01489的問題

Flex-grow / Flex-shrink / Flex-basis

Flex-grow / Flex-shrink / Flex-basis

原始型別 與 物件型別

原始型別 與 物件型別


Comments