nuxt3 notes

Runtime 값에 대하여..

nuxt.config.ts 데이터에서 특정값을 클라이언트 영역에서 사용할 수 있도록 전달해줄 수 있어야 한다.
뭐... .env 값들을 클라이언트 영역에서 사용할때 관심이 필요한 영역이다.

export default defineNuxtConfig({
  publicRuntimeConfig: {
    BASE_URL: process.env.BASE_URL
  },
  privateRuntimeConfig: {
    API_SECRET: process.env.API_SECRET
  }
});

이런식으로 공개용과 비공개용을 구분지어서 설정을 해둔다.

이렇게 설정한 값을 사용할때는 다음과 같이 이용할 수 있을것이다.

<script setup>
const config = useRuntimeConfig();
</script>

난데없이 함수가 사용되는데.. nuxt3 는 첫인상부터 트릭이 많이 보인다. ㅠ
이것 말고도 config.app으로 접근하면 기초적인 정보에 한해서 쓸만한 값들이 더 나온다.

출처: https://v3.nuxtjs.org/guide/features/runtime-config#runtime-config

클라이언트 영역에서 process값

클라이언트 영역에서 console.log(process)로 넣어서 페이지 열어보면 현재 클라이언트인지 백엔드인지 개발모드인지 플래그값으로 알 수 있다.

서버 영역의 라우트

nuxt2에서 서버 미들웨어에서만 확장시킬 수 있는줄 알고 하루종일 삽질했는데 잘 되던게 환경이 바뀌니 먹통이 되어버린 참사가 일어났다.

https://v3.nuxtjs.org/guide/features/server-routes

마지막에 서버 라우트라는것을 우연히 찾게 되었는데 지정된 경로에 파일을 만들어서 백엔드 영역의 라우트를 만들 수 있어보인다.
h3 라는 도구로 라우팅을 하는데 트릭이 너무 많아 보인다.
문서를 뒤져보지 않으면 해결 못하는것들이 너무나도 많다. ㅠㅠ