[HTML] Live Server 기본 설정 변경

Live Server 기본 설정 변경

"Live Server"의 기본 설정을 변경하려면 설정 파일을 수정해야 합니다. 아래에 디폴트 설정을 변경하는 방법을 단계별로 설명드리겠습니다.

1. 설정 파일 열기

Visual Studio Code의 사용자 설정 파일인 `settings.json` 파일을 수정하여 Live Server의 기본 설정을 변경할 수 있습니다.

1. Visual Studio Code를 엽니다.
2. `Ctrl + ,` (또는 `Cmd + ,` on macOS) 키를 눌러 설정 창을 엽니다.
3. 오른쪽 상단의 열쇠 모양 아이콘을 클릭하여 설정(JSON)을 엽니다. 이로 인해 `settings.json` 파일이 열립니다.

2. Live Server 설정 추가하기

`settings.json` 파일에서 Live Server의 기본 설정을 추가하거나 수정합니다. 아래에 몇 가지 주요 설정 항목을 예시로 들어보겠습니다.

주요 설정 항목

- port: 서버가 실행될 포트를 설정합니다.
- root: 서버가 시작될 디렉터리를 설정합니다.
- open: 서버 시작 시 브라우저를 자동으로 열지 여부를 설정합니다.
- browser: 서버 시작 시 사용할 브라우저를 설정합니다.
- ignoreFiles: 무시할 파일 및 디렉터리를 설정합니다.

예시 설정

{
    "liveServer.settings.port": 5500,                // 기본 포트 설정
    "liveServer.settings.root": "/path/to/project", // 서버 시작 디렉토리 설정
    "liveServer.settings.open": false,              // 브라우저 자동 열림 설정
    "liveServer.settings.browser": "chrome",        // 기본 브라우저 설정
    "liveServer.settings.ignoreFiles": [
        "**/*.scss",                                // 무시할 파일 패턴 설정
        "**/node_modules/**"
    ]
}

3. 설정 적용하기

설정을 수정한 후, 파일을 저장하면 자동으로 적용됩니다. 변경 사항을 반영하려면 Live Server를 다시 시작해야 할 수도 있습니다.

추가 설정 항목

`settings.json` 파일에서 사용할 수 있는 Live Server의 추가 설정 항목들은 다음과 같습니다:

- liveReload: 변경 사항을 자동으로 새로고침할지 여부를 설정합니다.
- noBrowser: 브라우저를 열지 않을지 여부를 설정합니다.
- host: 서버의 호스트를 설정합니다 (기본값: "127.0.0.1").
- https: HTTPS 프로토콜을 사용할지 여부를 설정합니다.

예시 설정

{
    "liveServer.settings.liveReload": true,
    "liveServer.settings.noBrowser": false,
    "liveServer.settings.host": "127.0.0.1",
    "liveServer.settings.https": {
        "enable": false,
        "cert": "",
        "key": ""
    }
}

정리

이와 같이 `settings.json` 파일을 통해 Live Server의 기본 설정을 변경하면, 사용자에게 맞는 환경을 구성할 수 있습니다. 필요한 설정을 추가하고 저장한 후, 변경 사항이 제대로 적용되었는지 확인해 보세요.