Svelte - Snowpack dev Port 조정 devOptions 사용

개발서버의 포트를 변경하기 위해서 찾아보던중 Snowpack 옵션중 devOptions을 변경해야 하는줄 알았다.

그럼 이에 대해서 알아보고자 한다. 설정을 하지 않으면 기본으로 지정된다.

module.exports = {
  devOptions: {
    port: 8080, // 개발 서버를 실행할 포트 번호
    fallback: 'index.html', // SPA인 경우 제공할 모든 사용자 경로
    open: 'default', // 새 브라우저 탭에 개발 서버를 열기, “chrome”, “firefox”, “brave”등 설치 경로 지정
    output: 'dashboard', // 콘솔의 출력 모드를 지정, "stream" | "dashbaord", 다중 실행시 stream으로 동일한 콘솔에 내용을 출력
    hostname: 'localhost', // 브라우저가 열리는 호스트 이름, 만약 특정 IP로 접속을 제한한 경우 해당 IP 입력
    hmr: true, // Hot Module Replacement(HMR, 수정사항을 즉시 반영) 활성화, 수정 내용이 있을시 화면 반영을 할 수 있음
    hmrErrorOverlay: true, // HMR 활성화시 자바스크립트 오류 표시 여부
    secure: false, // HTTP2 활성화 상태에서 HTTPS 사용 여부, SSL 인증서는 https://www.snowpack.dev/reference/configuration#devoptionssecure 참고
  }
}

필자의 경우  port 변경이 필요하여 아래와 같이 exports에 추가하였다.

module.exports = {
    mount: {
        public:'/',
        src:'/_dist_'
    },
    plugins: [
        '@snowpack/plugin-svelte',
        ['@snowpack/plugin-babel',{
            transformOptions: bableOptions()
        }],
        '@snowpack/plugin-dotenv',
        '@snowpack/plugin-optimize'
    ],
    alias: {
        '~': './src/'
    },
    devOptions: {
        port: 3000
    }
}