Javascript

[Nuxt] 헤더 (title, meta script ... 등) 넣는 방법

eulBlue 2024. 5. 16. 15:44

📱테스트 환경

"nuxt": "^3.11.2"
"vue": "^3.4.21"
"vue-router": "^4.3.0"

기존에 React 나 Next 개발을 할 때는 index.html 파일에 <script> 를 넣을 수 있었는데Nuxt 는 html 파일이 없더라 .. 그래서 title 이나 meta 데이터나 외부 script 들을어디다가 넣어야하나 .. 하고 찾아봤는데 생각보다 정보가 없어서당황스러웠다.그리고 nuxt.config 파일에 head: { ... } 에 넣으면 된다는데 안되는게 아닌가 !!알고보니 이건 반쪽자리 답변 ? 또는 정보 부족이였고

app 안에 head 안에 넣어주면 됐다.

사용방법은 다음과같다.

// nuxt.config.ts

export default {
	...
     app: {
        head: {
          title: "Hello World",
          script: [
            {
              src: "...",
            },
          ],
        },
  	},
    ...
}