nuxt3 notes
- Nest
- Development
- Category
- Javascript
- Hit
- 557
- Star
- 0
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 라는 도구로 라우팅을 하는데 트릭이 너무 많아 보인다.
문서를 뒤져보지 않으면 해결 못하는것들이 너무나도 많다. ㅠㅠ