포트 수정 및 배포

기본 실행 명령을 서버리스방법으로 오픈하도록 변경

package.json 코드 수정

"scripts": {
    "dev:webpack": "webpack-dev-server --mode development",
    "dev": "netlify dev",
    "build": "webpack --mode production",
    "lint": "eslint --fix --ext .js,.vue"
  },

 

netlify.toml 코드 수정 -> 포트및 웹팩으로 실행하는 명령부분 수정 (위에서 선언한 명령어와 맞춰줘야함)

# 개발 모드
[dev]  
  framework = "#custom"                 # 감지할 프로젝트 유형을 지정합니다. 앱 서버 및 'targetPort' 옵션을 실행하는 명령 옵션은 ''
  command = "npm run dev:webpack"       # 연결할 프로젝트의 개발 서버를 실행하는 명령(스크립트)을 지정합니다.
  targetPort = 8079                     # 연결할 프로젝트 개발 서버의 포트를 지정합니다.
  port = 8080                           # 출력할 Netlify 서버의 포트를 지정합니다.
  publish = "dist"                      # 프로젝트의 정적 콘텐츠 디렉토리를 지정합니다.
  autoLaunch = false                    # Netlify 서버가 준비되면 자동으로 브라우저를 오픈할 것인지 지정합니다.

 

webpack.config.js 코드 수정 -> 포트 수정 (위에서 선언한 포트와 맞춰줘야함)

// 개발 서버 옵션
  devServer: {
    host: 'localhost',
    port: 8079,
    hot: true
  }

 

명령어 실행: npm run dev -> 포트번호 설정 확인 및 동작 확인

 

github에 올리고 확인 -> .env 파일이 없는것을 확인, movie.js파일에서 중요정보 보여지는지 확인

 

netlify에서도 정상동작 확인