Setup My Vscode

April 8, 2021

background

Saya menggunakan phpstorm sebagai text editor utama sebelumnya, akan tetapi karena sebentar lagi abis masa aktifnya karena saya pakai lisensi untuk mahasiswa, jadi saya coba beralih ke vscode yang free.

setup ini mengikuti salah satu programmer yaitu caleb poziro dalam salah satu artikelnya yang bisa kalian lihat juga. menurut saya ini stup yang bagus dan clean.

Extension

  1. Beautify
  2. Laravel Extension Pack
  3. Tailwind CSS IntelliSense
  4. Vue 3 Snippets
  5. Auto-Open Markdown Preview
  6. Bracket Pair Colorizer 2
  7. vscode-icons
  8. Settings Sync
  9. Mayukai Theme
  10. Full JavaScript Complete Pack #note ini tidak semua extension dipakai didalamnya tapi akan lebih mudah untuk installnya pake yang pack ini jadi tidak perlu cari satu satu

vscodesetup

ini settingan yang harus kamu tambahkan di setting.json untuk penjelasnya satu persatu bisa dilihat di artikelnya caleb porzio.

{
  "workbench.iconTheme": "vscode-icons",
  "workbench.colorTheme": "Mayukai Mono",
  "editor.fontFamily": "Fira Mono for Powerline",
  "editor.fontSize": 18,
  "editor.suggestSelection": "first",
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
  "editor.fontLigatures": true,
  "intelephense.completionProvider.backslashPrefix": false,
  "php.suggest.basic": false,
  "files.trimTrailingWhitespace": true,
  "files.trimFinalNewlines": true,
  "files.associations": {
    ".php_cs": "php",
    ".php_cs.dist": "php",
    "*.php": "php" // this is super important, otherwise intelephense will not auto-index your project.
  },
  "editor.multiCursorModifier": "ctrlCmd",
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    //settingan laravel
    "**/public/[abcdefghjklmnopqrstuvwxyz]*": true,
    "**/public/i[abcdefghijklmopqrstuvwxyz]*": true,
    "**/vendor/[abcdefghijkmnopqrstuvwxyz]*": true,
    "**/vendor/l[bcdefghijklmnopqrstuvwxyz]*": true,
    "storage/framework/views": true
  },
  "zenMode.fullScreen": false,

  "workbench.editor.showTabs": false,
  "editor.minimap.enabled": false,
  "editor.codeLens": false,
  "workbench.activityBar.visible": false,
  "workbench.startupEditor": "none",
  "editor.renderControlCharacters": false,
  "editor.renderIndentGuides": false,
  "editor.renderLineHighlight": "none",
  "editor.matchBrackets": "near",
  "editor.lineNumbers": "off",
  "vscode_custom_css.imports": ["../../../.vscode/hide-top-bar.css"],
  "window.title": "${activeEditorMedium}${separator}${rootName} ${dirty}",
  "explorer.openEditors.visible": 0,
  "workbench.fontAliasing": "antialiased",
  "editor.renderWhitespace": "all",
  "editor.lineHeight": 40,
  "editor.letterSpacing": 0,
  "editor.suggestFontSize": 16,
  "editor.suggestLineHeight": 28,
  "terminal.integrated.fontSize": 15,
  "terminal.integrated.lineHeight": 1.5,
  "terminal.integrated.cursorBlinking": false,
  "terminal.integrated.cursorStyle": "line",
  "disableLigatures.mode": "Cursor",
  "workbench.sideBar.location": "right",
  "editor.emptySelectionClipboard": false,
  "editor.wordSeparators": "`~!@#%^&*()=+[{]}\\|;:'\",.<>/?",
  "editor.quickSuggestionsDelay": 0,
  "editor.formatOnPaste": true,
  "diffEditor.ignoreTrimWhitespace": false,
  "enableTelemetry": true,
  "editor.fontWeight": "normal",
  "window.newWindowDimensions": "offset",
  "editor.snippetSuggestions": "top",
  "diffEditor.renderSideBySide": false,
  "editor.gotoLocation.multipleReferences": "goto",
  "editor.gotoLocation.multipleDefinitions": "goto",
  "editor.gotoLocation.multipleDeclarations": "goto",
  "editor.gotoLocation.multipleImplementations": "goto",
  "editor.gotoLocation.multipleTypeDefinitions": "goto",
  "files.watcherExclude": {
    "**/.git/objects/**": true,
    "**/.git/subtree-cache/**": true,
    "**/node_modules/*/**": true
  },
  "git.autofetch": true,
  "terminal.integrated.fontFamily": "Fira Mono for Powerline"
}

semoga artikelnya dapat membantu anda untuk menemukan settingan yang terbaik untuk text editor anda.