55,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Nuxt.js 시작하기
장바구니 추가에 관하여 질문드립니다.
안녕하세요 강의를 듣는 중 궁금한점이 생겨서 질문드립니다. 강의에서 장바구니에 아이템을 추가할 때 async addToCart(){ await createCartItem(this.product) this.$store.commit('addCartItem', this.product) } 이렇게 createCartItem()으로 서버에 아이템을 추가하고 addCartItem으로 store에도 아이템을 추가하셨는데 이렇게 2번이나 추가하는 이유가 궁금합니다.
- 미해결Nuxt.js 시작하기
동적컴파일 적용방법
안녕하십니까 동적 컴파일에 대해 질문합니다 sample program <template> <div> <div @click="testevent">Hello Hi</div> {{ vueText }} </div> </template> <script setup> const vueText =ref('') const testevent = () => { vueText.value = 'good' } </script> 출력 Hello Hi Hello 클릭을 하면 Hello Hi good 이 sample program을 아래와 같이 변경하여 적용하면 <template> <div> <div v-html="renderData" /> {{ vueText }} </div> </template> <script setup> const vueText =ref('') const renderData = '<div @click="testevent">Hello Hi</div>' const testevent = () => { vueText.value = 'good' } </script> 출력 Hello Hi 로 정상적으로 나타나나 Hello 클릭을 하면 무응답으로 나타남 무응답이유를 구글링해서 보면 renderData가 들어갈때 컴파일이 안되었기 때문이라는 결론 도출 해서 동적 컴파일을 npm i vue-runtime-template-compiler 설치하여 시도해보았으나 [Vue warn]: Failed to resolve component: RuntimeTemplateCompiler 표시만되고 동작하지 않음 질문사항 1. renderData가 컴파일이 안되어 무응답인지 ? 궁금하며 만약 그럴경우 동적 컴파일을 해서 넣어주는 방법이 무엇입니까 ? 2. vue-runtime-template-compiler 설치하고 nuxt에서 사용하는 방법어떻케 되는지 궁금합니다 수고하세요
- 미해결Nuxt.js 시작하기
모바일, 데스크탑을 SSR에서 구분하는 방법?
안녕하세요. 문제 어떤 UI가 모바일용과 데스크탑용의 구성이 너무 달라서 모바일용 컴포넌트 / 데스크탑용 컴포넌트로 개발되어있습니다. 이걸 미디어쿼리처럼 사용자의 device width에 따라 모바일/데스크탑용 UI를 각각 뿌려주고 싶지만, SSR에서는 javascript의 window 객체는 만들어져 있지 않기 때문에 접근은 불가능하므로 javascript로는 사용자 device의 width를 가져오는건 불가능에 가까운것 같고 대신에 request의user-agent를 이용해 사용자 device의 정보를 가져오면 판별은 할 수 있을꺼 같은데 미디어 쿼리같이 실시간으로 사용자 device의 width에 따라 UI를 나누는건 어려운 상황 질문 보통 모바일용과 데스크탑용 컴포넌트를 가지고 있을때 SSR에서는 어떻게 모바일과 데스크탑을 구분하시나요?
- 미해결Nuxt.js 시작하기
nuxt 배포 관련 (윈도우 서버)
안녕하세요. 캡틴판교님 vue 초급 강의부터 nuxt 강의까지 덕분에 잘 듣고 있습니다. 제가 최근에 nuxt강의를 듣고 사내 홈페이지 작업을 nuxt로 진행하였습니다. 메인페이지가 작업되어 테스트겸 서버에 배포를 진행하였습니다. 현재 사내 서버는 원격 데스크톱으로 연결된 클라우드 서버 입니다.(윈도우) (IIS 설정으로 도메인과 폴더를 연결중) 업로드하는 과정은 파일을 파일질라로 업로드 후 원격 테스크톱으로 접속하여 폴더 이동을 해야 합니다. target을 static으로 설정하고 nuxt generate로 실행하여 dist폴더의 파일들을 적용하였습니다. publicPath설정으로 빌드할 때 html,css,img,js 누락없이 파일경로도 맞게 설정 되었는데 vue script 부분이 동작을 하지 않고 있습니다 mouted() 등등... 이럴 때는 어떻게 해야 할까요??? 바쁘시겠지만 답변 부탁 드립니다.
- 미해결Nuxt.js 시작하기
export 에러
안녕하세요. 장기효님. 실습을 따라하던 중 import 시 찾을 수 없다는 에러가 나와 문의 드립니다. 현재 저의 폴더 구조는 아래와 같으며, 당면한 에러코드는 아래와 같습니다. pages/main.vue 의 코드는 아래와 같습니다. <template> <div> <h1>메인페이지</h1> <NuxtLogo /> </div> </template> <script> import { NuxtLogo } from '../components/NuxtLogo.vue' export default { components: { NuxtLogo, }, } </script> <style></style> 에러 로그를 보고 components/NuxtLogo.vue의 코드에 name 옵션을 추가하였으나 에러가 해결되지 않아 질문 남깁니다. (NuxtLogo.vue) <template> <svg class="nuxt-logo" viewBox="0 0 45 30" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M24.7203 29.704H41.1008C41.6211 29.7041 42.1322 29.5669 42.5828 29.3061C43.0334 29.0454 43.4075 28.6704 43.6675 28.2188C43.9275 27.7672 44.0643 27.2549 44.0641 26.7335C44.0639 26.2121 43.9266 25.6999 43.6662 25.2485L32.6655 6.15312C32.4055 5.70162 32.0315 5.32667 31.581 5.06598C31.1305 4.8053 30.6195 4.66805 30.0994 4.66805C29.5792 4.66805 29.0682 4.8053 28.6177 5.06598C28.1672 5.32667 27.7932 5.70162 27.5332 6.15312L24.7203 11.039L19.2208 1.48485C18.9606 1.03338 18.5864 0.658493 18.1358 0.397853C17.6852 0.137213 17.1741 0 16.6538 0C16.1336 0 15.6225 0.137213 15.1719 0.397853C14.7213 0.658493 14.3471 1.03338 14.0868 1.48485L0.397874 25.2485C0.137452 25.6999 0.000226653 26.2121 2.8053e-07 26.7335C-0.000226092 27.2549 0.136554 27.7672 0.396584 28.2188C0.656614 28.6704 1.03072 29.0454 1.48129 29.3061C1.93185 29.5669 2.44298 29.7041 2.96326 29.704H13.2456C17.3195 29.704 20.3239 27.9106 22.3912 24.4118L27.4102 15.7008L30.0986 11.039L38.1667 25.0422H27.4102L24.7203 29.704ZM13.0779 25.0374L5.9022 25.0358L16.6586 6.36589L22.0257 15.7008L18.4322 21.9401C17.0593 24.2103 15.4996 25.0374 13.0779 25.0374Z" fill="#00DC82" /> </svg> </template> <script> export default { name: 'NuxtLogo', } </script> <style> .nuxt-logo { height: 180px; } </style>
- 미해결Nuxt.js 시작하기
nuxt v2.15.8
버전 차이로 인해 다른 분들도 에러 사항이 있는 걸로 알고 있습니다. 저도 v2.15.8을 쓰며 강사님과의 파일 구조가 다른데요. 저도 error 화면을 구현하며, 다른 분들과 동일한 에러 발생하여 루트에서 layouts 폴더를 새로 생성하여 error.vue를 생성, .eslintrc.js의 rules에서 multi-word-component-names를 설정해주어 오류를 해결했습니다. 버전 업하면서 프로젝트 구조가 달라진 것은 해당 프로젝트를 쓰지 않으려는 nuxt의 앞으로의 방향으로 이렇게 변화된건지 궁금증이 생겼습니다. 초기 프로젝트 생성 시 기존에 없던 layouts 디렉토리를 생성하여 구현해나가는 것이 코딩 컨벤션에 어긋나지 않는지. 앞으로도 강사님의 폴더 구조대로 새로 폴더를 생성하여 개발하는 것도 괜찮은지 여쭙고 싶습니다.
- 미해결Nuxt.js 시작하기
Nuxt 에서 Cookie 사용이 잘 안되네요..ㅠ.ㅠ
안녕하세요. 기초강의부터 Nuxt 강의까지 많이 도움을 받았습니다. 다름 아니라... Nuxt 에서 쿠키를 사용할려고 하는데 생각처럼 잘 안되네요... 로그인 구현후 인증값을 쿠키로 저장하고 store 의 state에 쿠키값이 존재시 state 의 데이터를 초기화 할려고 합니다. import Cookies from "js-cookie"; export const state = () => { userName = Cookies.get('userName') || ''; } store/index.js 에 위와 같이 state 값이 쿠키값을 초기화할려고 합니다. 하지만 userName 에 쿠키값이 초기화되지 않습니다. nuxtServerInit 등 여러삽질을 해봤지만 해결점을 찾지 못했습니다. Nuxt 에서 쿠키활용에 대해 설명해주시면 많은 도움이 될거같습니다.
- 미해결Nuxt.js 시작하기
multi-word-component-names
안녕하세요! 장기효님! 덕분에 nuxt.js까지 잘 학습하고 있습니다. vue에서 코딩 컨벤션으로 컴포넌트 이름 작성 시 2 단어 이상 사용하라는 것은 이전 강의에서 계속 설명해주셨듯이 잘 알고 있는데요. nuxt.js 강의를 따라가며 한 가지 의문이 생겨 질문 남깁니다. 지난 강의에서 진행한 main.vue의 경우 1개의 단어를 사용하였음에도 별다른 에러를 발생하지 않았는데, 이번에 product 생성 후 내부에 index.vue 생성 및 로컬로 실행했을 경우, 아래와 같이 에러가 발생하는 것으로 나타납니다. 저는 현재 nuxt.js v2.15.8를 사용 중이고, 왜 이렇게 특정 경우에만 오류가 발생하는지 알려주시면 감사하겠습니다.
- 미해결Nuxt.js 시작하기
router에 관한 질문입니다
안녕하십니까 ? 강의를 바탕으로 homepage를 만드는 중인데 잘안되는 부분이 있어 질문 합니다 질문내용 홈피에서 검색(input, button)으로 구성되어 있습니다 input에 입력한후 button을 눌러 검색 결과가 나타나게끔 하고 있습니다 * program 측면에서 볼때 1) router 수행 this.$router.push({ name: 'integratedSearch', params: { searchKeyword: this.searchword } }) 2) page 폴더 밑에 integratedSearch.vue에 asyncData를 이용해서 해당내용을 가져 옵니다 async asyncData(context) { const res = await context.$axios.$get('/api/integratedSearch', { params: { searchKeyword: context.route.params.searchKeyword } }) const totalData = res return { totalData } }, 의문사항 1. 검색어를 '홍길동'으로 입력하고 button을 누르면 검색이 잘됩니다 2. 그상태에서 '홍길동'을 지우고 '길말동'으로 검색을 하면 검색이 되질를 않습니다 (새로고침을 하고 '김말동'으로 검색하면 잘됩니다) 확인해보니 asyncData가 실행이 되질 않습니다 개인적인 의견으로는 this.$router.push에서 동일한 url이어서 동작을 하지않아 asyncData가 동작하지 않는걸로 보입니다 3. 구글링해서 보니 refresh기능을 사용하라고 되어 있는데 어떻케 적용해야할지도 고민이 되고 이런경우 제대로 동작을 시킬려면 어떻케 하면 되나요 수고하세요
- 미해결Nuxt.js 시작하기
axios 관련 질문
안녕하십니까 ? Nuxt 설치시 Linting tools을 None으로 해서 설치를 하였습니다 추가적으로 Linting tools를 ESLint, Prettier 설치 할수 있는지 궁금합니다 그리고 Nuxt의 backend를 Laravel할 경우 1) DB Data를 갖고올때 axios 설정이 잘못된것인지 모르겠으나 사용을 할려면 this.$axios.$get(url) 이런 form으로 해야만이 data를 갖고 올수 있습니다. 강의내용처럼 import하고 axios.get(url)으로 해서 사용할려면 어떻케 하면 되나요 2). asyncData()도 사용가능한지 궁금합니다 1)항과 axios 문제 인것 같은데... 3) nuxt.xonfig.js file에서 axios 설정은 아래와 같이 했습니다 axios: { baseURL: 'http://localhost:8000/', credentials: true }, 수고하세요
- 미해결Nuxt.js 시작하기
GitHub연동 질문
지금까지 무난하게 잘 따라왔는데, 배포에서 잘 안되어서 첫질문 드려봅니다. 이번차수에~ github연동에서 아래처럼 에러가 나고 강의처럼 연동이 안됩니다. 구글링을 해보면서 해결을 해보려했지만, 잘 안됩니다.확인 한번 부탁드립니다.구글링해보다보니 22년 4월 16일부터 Auth부분이 달라진거 같은데..맞다면 다른 방법 안내 한번 부탁드려요.(https://kanaxx.hatenablog.jp/entry/2022/04/18/011926)ㄱ
- 미해결Nuxt.js 시작하기
컴포넌트화 시키는 방법
안녕하십니까 ? 불규칙적이고 다양한 dom을 사용하는 contents를 컴포넌트화 시킬려면 어떻케 해야하는지 궁금합니다 이런 contents가 만개정도가 있다면 만개 page를 만들수 없는 여건입니다(아래내용 참조) (아래내용에서 contents를 불러오는 event(viewContents) 와 dom 속성과 style을 변경하는 이벤트 동작 필수) 좋은 아이디어가 있을까요 ? 컴포넌트화 시킬 내용 <template> <div class="xNode" id="lawcurtree"> <div class="curNode"> <img id="d0imgtree" class="inline-block" src="/image/tree/base.gif"> <span class="lawmark">법률</span> <div class="inline-block hover:text-blue-500" @click="viewContents('A0000000887Z1817620210518')">근로기준법 [시행 2021. 11. 19.] [법률 제18176호, 2021. 5. 18., 일부개정]</div> </div> <div id="b0imgtree" style="display: block;"> <div class="curNode"> <img id="c1imgtree" class="inline-block" src="/image/tree/minus.gif" @click="displayOnOff('b1imgtree', 'c1imgtree')"> <img id="d1imgtree" class="inline-block" src="/image/tree/folderopen.gif"> <span class="lawmark">시행령</span> <div class="inline-block hover:text-blue-500" @click="viewContents('A0000001009Z3213020211119')">근로기준법 시행령 [시행 2021. 11. 19.] [대통령령 제32130호, 2021. 11. 19., 일부개정]</div> </div> <div id="b1imgtree" style="display: block;"> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img id="c4imgtree" class="inline-block" src="/image/tree/minus.gif" @click="displayOnOff('b4imgtree', 'c4imgtree')"> <img id="d4imgtree" class="inline-block" src="/image/tree/folderopen.gif"> <span class="lawmark">시행규칙</span> <div class="inline-block hover:text-blue-500" @click="viewContents('A0000008520Z33520211119')">근로기준법 시행규칙 [시행 2021. 11. 19.] [고용노동부령 제335호, 2021. 11. 19., 일부개정]</div> </div> <div id="b4imgtree" style="display: block;"> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/line.gif"> <img id="c1imgtree5" class="inline-block" src="/image/tree/plusbottom.gif" @click="displayOnOff('b1imgtree5', 'c1imgtree5')"> <img id="d1imgtree5" class="inline-block" src="/image/tree/folder02.gif"> <span>행정규칙 </span> </div> <div id="b1imgtree5" style="display: none;"> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/joinbottom.gif"> <span class="rulemark">훈령</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000018446Z14220150227')">임금체불사업주 명단 공개 및 체불자료 제공 관련 업무 처리 규정 [시행 2015. 2. 27.] [훈령 제142호, 2015. 2. 27., 일부개정]</div> </div> </div> </div> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img id="c1imgtree4" class="inline-block" src="/image/tree/plusbottom.gif" @click="displayOnOff('b1imgtree4', 'c1imgtree4')"> <img id="d1imgtree4" class="inline-block" src="/image/tree/folder02.gif"> <span>행정규칙 </span> </div> <div id="b1imgtree4" style="display: none;"> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/join.gif"> <span class="rulemark">예규</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000023689Z4720120925')">통상임금 산정지침 [시행 2012. 9. 25.] [예규 제47호, 2012. 9. 25., 일부개정]</div> </div> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/join.gif"> <span class="rulemark">고시</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000018909Z2019-3620190731')">재량근로의 대상 업무 [시행 2019. 7. 31.] [고시 제2019-36호, 2019. 7. 31., 일부개정]</div> </div> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/joinbottom.gif"> <span class="rulemark">고시</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000024093Z2015-7720151014')">평균임금산정 특례 고시 [시행 2015. 10. 14.] [고시 제2015-77호, 2015. 10. 14., 일부개정]</div> </div> </div> </div> <div class="curNode"> <img id="c2imgtree" class="inline-block" src="/image/tree/minus.gif" @click="displayOnOff('b2imgtree', 'c2imgtree')"> <img id="d2imgtree" class="inline-block" src="/image/tree/folderopen.gif"> <span class="lawmark">시행령</span> <div class="inline-block hover:text-blue-500" @click="viewContents('A0000001695Z2246520101027')">근로감독관규정 [시행 2010. 10. 27.] [대통령령 제22465호, 2010. 10. 27., 전부개정]</div> </div> <div id="b2imgtree" style="display: block;"> <div class="curNode"> <img class="inline-block" src="/image/tree/line.gif"> <img class="inline-block" src="/image/tree/joinbottom.gif"> <img id="d3imgtree" class="inline-block" src="/image/tree/folder.gif"> <span class="lawmark">시행규칙</span> <div class="inline-block hover:text-blue-500" @click="viewContents('A0000006784Z15820160616')">근로감독관증 규칙 [시행 2016. 6. 16.] [고용노동부령 제158호, 2016. 6. 16., 타법개정]</div> </div> </div> <div class="curNode"> <img id="c1imgtree3" class="inline-block" src="/image/tree/plusbottom.gif" @click="displayOnOff('b1imgtree3', 'c1imgtree3')"> <img id="d1imgtree3" class="inline-block" src="/image/tree/folder02.gif"> <span>행정규칙 </span> </div> <div id="b1imgtree3" style="display: none;"> <div class="curNode"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/join.gif"> <span class="rulemark">훈령</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000007826Z37420211025')">근로감독관집무규정 [시행 2021. 10. 25.] [훈령 제374호, 2021. 10. 25., 일부개정]</div> </div> <div class="curNode"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/join.gif"> <span class="rulemark">예규</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000023822Z2015-10020151106')">퇴직의 효력발생시기 [시행 2015. 11. 6.] [예규 제2015-100호, 2015. 11. 6., 일부개정]</div> </div> <div class="curNode"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/join.gif"> <span class="rulemark">고시</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000033277Z2021-2920210401')">특별연장근로 건강보호조치 [시행 2021. 4. 6.] [고시 제2021-29호, 2021. 4. 1., 제정]</div> </div> <div class="curNode"> <img class="inline-block" src="/image/tree/empty.gif"> <img class="inline-block" src="/image/tree/joinbottom.gif"> <span class="rulemark">고시</span> <div class="inline-block hover:text-blue-500" @click="viewContents('B0000024895Z2017-1320170113')">한국표준산업분류 [시행 2017. 7. 1.] [고시 제2017-13호, 2017. 1. 13., 전부개정]</div> </div> </div> </div> </template>.
- 미해결Nuxt.js 시작하기
강의 노트가 어디에 있나요(내용무)
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
- 미해결Nuxt.js 시작하기
URL 접근과 page 이동 질문
강의 잘 듣고 있습니다. URL 직접 이동 과 page 내 이동 차이점이 궁금해서 질문을 남기게 되었습니다. 다른 강의에서 설명을 하실지 모르겠어서 질문이 조심스럽네요. Q1. URL 이동의 뜻이 location.href = '주소' 로 이동 할 경우 인걸까요? Q2. 그 이후부터는 vue.js CLI 앱이라고 표현하는 CSR 앱으로 동작하는걸까요? (main 페이지 에서 장바구니로 이동 시 SPA 로 동작) Q3. 2번이 맞다면 이렇게 동작하는게 target: 'static' 이 아닌 'server' 로 SSR 이라 그런가요? Q4. SSR 이라서 처음 URL 로 진입하는 페이지만 서버에서 랜더링을 하고, 나머지는 vue router 에 의한 페이지 이동은 SPA 와 거의 동일하게 동작하는 걸까요?
- 미해결Nuxt.js 시작하기
렌더링이 느려 서버가 꺼지는 현상에 관해
안녕하세요 먼저 NUXT수업 잘듣고 있습니다. 질문 사항은 NUXT로 진행중 로딩이 너무느려 npm run dev가 자꾸 자동으로 꺼지는 현상때문입니다. 아무래도 원인은 이미지로 보여집니다. 로딩 속도가 price,name은 잘나오는 반면에 이미지는 너무 느리게 출력 되거나 혹은 아예 출력이 안되 서버가 꺼지게 됩니다. 해결방법은 아직 찾지 못했습니다. 명확한 오류를 발견하지 못해서 ... 혹시몰라서 Npm run start도 해봤지만 다음과 같이 자동으로 꺼지게 되더라고요 정확한 원인과 해결방안을 여쭙고 싶습니다. Nuxt version : 2.15.8
- 미해결Nuxt.js 시작하기
유니버셜 모드에 대해서 동작원리 질문
맨처음에 ssr로 정적 html파일을 받아오고 동시에 받아온 자바스크립트 번들에 대해서 질문드립니다. 스크린샷을 보시면 app.js 번들 파일(?)이 3개 정도 들어오는데 이 번들파일을 근거로 페이지 이동을 할때 브라우저가 페이지 별로 필요한 번들을 코드분할을 통해서 서버에 요청해서 가져오는건지 궁금합니다. 처음 페이지를 받아온 후에는 csr로 렌더링 된다고 해서요. 이렇게 동작하는지가 궁금하네요..아니라면 상세히 설명해주시면 더욱 감사하겠습니다.
- 미해결Nuxt.js 시작하기
라우터 경로가 자동으로 생기지 않는 케이스에 대해
질문자체는 제목과 같습니다. 영상과 같이 product.vue를 만들어 저장까지하는 과정을 걸쳤음에도 router.js에 경로가 자동으로 완성되지 않았습니다. 버전은 2.15.8로 해당 영상과 버전은 다르나 문제의 원인이라 생각되지는 않습니다. 어떤 원인인지 궁금합니다!! * 방법은 npm run dev로 실행을 한 이후에 생기는 것으로 해결하였습니다만은 원인은 찾지 못했습니다.
- 미해결Nuxt.js 시작하기
asyncData, fetch(context) , fetch()
강의 너무 잘 듣고있는데 공부 중에 이것저것 호출해보면서 궁금증이 생겨서 질문드립니다. fetch 메소드에 파라미터(context)가 있냐 없냐에 따라서 동작방식이 다름은 이해했습니다. 동작하는 순서도 다르구요 ex. fetch(context) => beforeCreate() 이전에 호출 fetch() => created() 이후에 호출 router로 이동시에는 CSR만 동작하는 걸로 아는데 여기서 궁금증이 있습니다. fetch()인경우 깜빡거리는데 asyncData와 fetch(context) 경우 깜빡거리지 않던데 이유를 알 수있을까요? CSR에서 asyncData와 fetch(context)가 호출되는 것은 알지만 그런 이유라면 fetch()는 깜빡거리는 이유를 잘 모르겠어서요. asyncData와 fetch(context)는 CSR에서 호출되더라도 무조건 SSR로 동작하는건지 궁금합니다.
- 미해결Nuxt.js 시작하기
nuxt generate 의 head 작동 문제
nuxt에서 동적으로 head()를 할당해주었습니다. npm run build에서는 잘 동작하지만 npm run generate 한 곳에서는 제대로 head()가 동작하지 않습니다.. 페이지마다 동적으로 meta를 할당해주고 싶은데, generate 로는 안 되는 걸까요? 도대체 문제가 어떤걸까요?
- 미해결Nuxt.js 시작하기
.
.