[Firebase]"하얀 글자들 사이에 빨간색을 경계할 것", 진짜 진짜 마지막 최종 빌드 안하는 법 / Firebase store Github Actions Deploy With NuxtJS/ [파이어베이스 깃허브 배포 자동화]

"하얀 글자들 사이에 빨간색을 경계할 것"

 

 

 

 

ન?

---

Firebase store Github Actions Deploy with NuxtJS / [파이어베이스 깃허브 배포 자동화]

수 많은 시행 착오에 shell 스크립트와 firebase.json 세팅을 아무리 해도 되지 않던 배포 에러..

깃허브 배포 할 때는 가장 큰 주의점이 있는데 firebase.json "hosting" 값 안에 "site" 또는 "target"이 둘중 하나만 존재하여야 한다.

수 많은 에러 중 하나의 결정적 해결이었다. 분명 CI에서 npm run build 스크립트를 실행했는데도 빌드 폴더 dist가 없다는 것이다.

ටㅏ...

생각해보니 Nuxt.js에서는

npm run build는 nuxt.config.js에서 target 값이 'server'로 되어있을 때

.nuxt/dist 경로로 빌드 조각들이 생성된다. Webpack으로 Tree Shaking되어 압축된 정적 JS와 CSS파일들로 구성되어 있는데 Node.js 서버에 배포할 때 쓰는 것이다.

파이어베이스나 vercel등 호스팅 서비스에 배포하려면 nuxt generate || npm run generate를 사용하여야 한다.

 

generate 빌드는 default 값을 dist로 하고 있지만 nuxt.config.js 내에서 변경할 수 있다.

ERROR :: 배포시 발생한 Error: Specified "public" directory "dist" does not exist, can't deploy hosting to site "***"

또는 호스팅할 "site"또는 "target" 정보가 없다고 나올 때

"site" 또는 "target" 값이 프로젝트 ID의 Alias가 아닌, 진짜 본 프로젝트 ID로 넣어보길 바람..

(alias 넣었더니 인식을 못했던 것)

 

 

---

끝.