isual Studio Code(이하 VSCode)  세계 개발자들이 사랑하는 에디터입니다. 하지만 그냥 쓰기엔 아깝습니다. 프로젝트별로 설정을  해두면 포맷 자동화, 디버깅, 확장 추천까지 모두 손쉽게 관리할  있습니다.

    이번 글에서는 VSCode에서  알아야  설정 파일들을 정리하고,  파일의 목적과 유용한 설정 예제를 소개합니다.

    1. settings.json  전역 또는 프로젝트별 설정

    VSCode 기본 설정 파일입니다. 전역 설정뿐만 아니라 프로젝트 폴더 안에 .vscode/settings.json으로 두면 워크스페이스 단위 설정도 가능합니다.

    {
      "editor.formatOnSave": true,
      "editor.tabSize": 2,
      "files.exclude": {
        "**/.DS_Store": true,
        "**/node_modules": true
      },
      "github.copilot.editor.enableAutoCompletions": true
    }

    2. launch.json  디버깅 환경 구성

    .vscode/launch.json 파일을 이용해 Node.js, PHP, Python  디버깅 구성을 설정할  있습니다.

    예시 (PHP Xdebug):
    
    {
      "version": "0.2.0",
      "configurations": [
        {
          "type": "php",
          "request": "launch",
          "name": "Listen for Xdebug",
          "port": 9003
        }
      ]
    }

     

    3. tasks.json  반복 작업 자동화

    빌드, 테스트, 린트 명령어를 정의해 빠르게 실행할  있습니다.

    {
      "version": "2.0.0",
      "tasks": [
        {
          "label": "npm: build",
          "type": "shell",
          "command": "npm run build"
        }
      ]
    }

     

    4. extensions.json  확장 추천 공유

    프로젝트 팀원에게 추천 확장 기능을 자동으로 안내할  있습니다.

    {
      "recommendations": [
        "dbaeumer.vscode-eslint",
        "esbenp.prettier-vscode",
        "github.copilot"
      ]
    }

     

    5. .editorconfig  에디터  코드 스타일 통일

    VSCode 외에도 IntelliJ, Sublime 등에서도 읽을  있는 포맷 설정 파일입니다.

    root = true
    
    [*]
    indent_style = space
    indent_size = 2
    charset = utf-8
    trim_trailing_whitespace = true
    insert_final_newline = true

    마무리

    VSCode 가볍지만 강력한 설정 기능을 갖추고 있습니다. 각종 설정 파일을  활용하면,  단위 개발에서 코드 품질을 통일하고 생산성을 크게 끌어올릴  있습니다.

     

    Posted by 천상나타