묻고 답해요
150만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
순위 정보를
불러오고 있어요
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
config.authCookieName 에서 타입 오류가 발생합니다.
[vue-tsc] Argument of type 'unknown' is not assignable to parameter of type 'string'./workspace/dev/nuxt-tutorial/server/routes/auth/login.post.ts:38:20 36 | 37 | const config = useRuntimeConfig(); > 38 | setCookie(event, config.authCookieName, JSON.stringify(userWithoutPassword)); | ^^^^^^^^^^^^^^^^^^^^^ 39 | 40 | return { 41 | user: userWithoutPassword,[vue-tsc] Argument of type 'unknown' is not assignable to parameter of type 'string'./workspace/dev/nuxt-tutorial/server/utils/auth.ts:5:43 3 | export function getUserFromEvent(event: H3Event) { 4 | const config = useRuntimeConfig(); > 5 | const userJsonString = getCookie(event, config.authCookieName); | ^^^^^^^^^^^^^^^^^^^^^ 6 | 7 | console.log('userJsonString: ', userJsonString);config.authCookieName 에서 타입 오류가 발생하는데 어떻게 해결 할 수 있을까요..?
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
unhandledRejection 오류는 어떻게 해결 해야 하나요?
현재 우분투 서버단에서 nuxt3와 pm2로 실행관리를 하려면 테스트중입니다.그런데, 잘 작동하다가 한번씩.. 아래와 같은 오류를 발생시키면서 서버가 죽습니다.며칠동안 방법을 찾으려고 했으나, 찾을수가 없어서 질문 드립니다.(구글링, gpt 하면서 체크하라는 부분은 다 체크해 보았는데.. 못 잡았습니다.. 해당 패키지들은 최신버전이고, node도 다른버전으로 변경해 보았으나, 동일한 현상을 발생시킵니다.)관련 이슈도 있는거 같던데.. 혹 알고 계시는거 없는지요??0|nuxt3 | ERROR [unhandledRejection] connect ECONNREFUSED 127.0.0.1:43671 0|nuxt3 | 0|nuxt3 | at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1606:16) 0|nuxt3 | 0|nuxt3 | 0|nuxt3 | ERROR [unhandledRejection] connect ECONNREFUSED 127.0.0.1:43671 0|nuxt3 | 0|nuxt3 | at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1606:16) 로컬에서 개발시에는 개발중 이런 문제가 없었던 것으로 기억하는데..서버단으로 이동후에는 이러네요..정확한 원인을 모르니, 많이 답답합니다.. 알려주세용..
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
플로그인 설치
안녕하세요volar 설치 확인 중 . volar 를 입력하면 강의에서 볼 수 있는 " Vue Langve Features(Volar)" 이 검색 되질 않습니다. TypeScriptg vue Plugn(volar) 은 취소선으로 처리되어 김색 데고요...Visaul Code 문제?..글쎄요.. 잘 모르겠습니다. 지원 부탁 드립니다.
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
nuxt3 프로젝트를 git pull 후 해야 하는 것
nuxt3 프로젝트를 git clone으로 pull 받은 후 해야 할 일 것들이 뭘까요?nvm 설치 후 node 와 npm 은 버전을 맞추었습니다. 이후 npm install하면 package.json 파일을 보고 의존성 라이브러리 추가되는 것으로 알고 있습니다.이 외에 더 설치나 설정을 해야 할 것이 있을까요? 물론 git저장소에는 정상적으로 빌드 된 것들만 올라갔습니다.
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
Firebase 요금제에 관한 문의사항
Firebase 요금에 관한 문의 사항이 있습니다.회사 내 프로젝트인데 Firebase가 오픈 소스인 줄 알았는데 요금제가 있더군요생각보다 요금제에 대한 함정이 있는 것 같아 사용하기가 선뜻 내키지 않습니다.또한 저희는 오픈 소스를 사용해야 하는 입장이고 클라우드 환경이라면 AWS를 이용해야 하는 상황입니다. 질문혹시 Firebase를 사용하지 않고 자체 DB를 이용한다고 할 때 강의 내용에 나온 프론트 화면이나 로직은 사용이 가능합니까?만약 Firebase Store를 이용하지 않는다면 이 강의는 건너 뛰고 Nuxt3로 가는 것이 좋습니까?
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
사용자 컴포넌트를 작성하는 것에 대한 문의
프로젝트에서 Quasar를 이용하여 프론트를 개발할 때textarea, password 와 같은 입력 필드들을 base component로 만들어서 개발자에게 제공하는 것이 일반적인 방식인가요? 아니면 개발자가 하나하나 type이라던지 placeholder를 지정하면서 개발하는 것이 일반적인 방식인가요?
-
해결됨Vue 3 시작하기
안녕하세요 선생님 Event Emit 질문 드립니다.
선생님 강의 들으면서 따라하고 있습니다강의랑 똑같이 타이핑하면서 공부하고 있는데 왜 타임라인에서 이벤트 호출이 안되는지 이유를 모르겠어서 질문 남깁니다! 확인 부탁드립니다...!
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
Course 데이터 가져오기 - v-slot="{ navigate }" 인식을 못하고 빨간줄이 뜹니다.
<NuxtLink v-slot="{ navigate }" custom :to="`/course/${courseSlug}`"> <CourseCard :title="title" :subtitle="subtitle" :thumbnail="thumbnail" /> </NuxtLink>해당 부분에서 오류가 발생하고 상세페이지로 진입이 안되는데 navigate 를 쓸 수 없는건가요?
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
Firebase 강의 Section1의 Auto page 설정에 관련되어
강의 내용대로 진행을 하였는데 아래와 같은 에러가 발생합니다. 순서는 아래와 같이 진행을 했습니다.vitePlugins에서 조금 틀리게 나오지만 없는 부분은 주석 처리해서 해보았지만 같은 현상입니다.
-
해결됨Vue 3 시작하기
다음 강의
강사님 강의 잘 듣고 있습니다!다음 강의를 들으려고 하는데요Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex이 강의는 이제 쿠폰이 제공되지 않는건가요? 양식을 기입했는데 쿠폰이 모두 소진됐다고 떠서요!
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
definePageMeta 리랜더링이 안됩니다..
<template> <div class="q-pa-xl"> <AppCard> <template #header> <div class="text-h5 text-weight-medium">{{ course?.title }}</div> <div class="flex q-gutter-x-sm items-center q-mt-sm text-grey-8"> <span class="flex items-center"> <q-icon name="star" size="16px" color="orange" /> <span>{{ course?.rating }}</span> </span> <span>{{ course?.reviewsCount }}</span> <span>·</span> <span>{{ course?.studentCount }}</span> <q-space /> <a class="text-bold" :href="course?.reviewsUrl" target="_blank"> 수강평 보기 </a> </div> </template> <div class="q-mb-md"> <VideoPlayer :src="course?.video" /> </div> <div class="row q-col-gutter-md"> <div class="col-6"> <q-btn label="인프런에서 수강하기" unelevated class="full-width" color="primary" :href="course?.inflearnUrl" target="_blank" /> </div> <div class="col-6"> <q-btn label="짐코딩 클럽에서 수강하기" unelevated class="full-width" color="red" :href="course?.gymcodingUrl" target="_blank" /> </div> </div> <p class="q-mt-lg text-grey-8"> {{ course?.content }} </p> <template #footer> <q-btn v-if="prevCourse" label="이전 강의" color="primary" unelevated :to="prevCourse.path" /> <q-space /> <q-btn v-if="prevCourse" label="쿼리추가" color="primary" unelevated :to="{ path: $route.path, query: { timestamp: Date.now() } }" /> <q-space /> <q-btn v-if="nextCourse" label="다음 강의" color="primary" unelevated :to="nextCourse.path" /> </template> </AppCard> </div> </template> <script setup lang="ts"> const route = useRoute(); const courseSlug = route.params.courseSlug as string; const { course, prevCourse, nextCourse } = useCourse(courseSlug); console.log('re'); definePageMeta({ key: (route) => route.fullPath, }); </script> <style scoped></style> <template> <NuxtLayout> <NuxtPage /> <!-- <RouterView /> --> <!--layouts>default.vue의 slot부분--> </NuxtLayout> </template> <script setup lang="ts"></script> 해당 코드처럼 넣은후 쿼리파라미터를 넣어도 리랜더링이 안되네요.. ㅠ
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
nuxt3의 실시간 렌더링 오류는 해결 할수 없는건가요??
아직 강좌 초반부이기는 한데.. 테스트 코드를 작성하면서 실시간 렌더링을 되면서 오작동을 너무 많이 한다고 느껴집니다..리엑트나 next.js를 사용시에는 이정도까지는 아니였는데, nuxt3는 좀 많이 심한거 같은데..저만의 생각인가요?? 예로.. 같은 경로에 렌더링 코드를 구성하기 위해서..pages/course.vue 생성하고.. http://localhost:3000/course 로 접속해서 결과물 확인했습니다.그리고, pages/course.vue를 삭제하고, pages/course/index.vue를 생성해서 다시 새로고침이나 다른 브라우저로 접근해도 동일한 오류를 발생시킨 페이지를 보여줍니다. 물론 nuxt3를 재실행하면 문제는 해결이 되기는 합니다.여기서 질문은.. nuxt3를 재실행하는 형태면 실시간 렌더링이 된다고 할 수 있느냐는 거죠... ㅡ.ㅜ;강의 보시면 테스트 코딩하니, 이제 제대로 작동한다고 생각을 하는거지.. 복잡한 프로젝트가 이처럼 정상적인 코드가 오류를 뿜어되면 어떻게 해야 할지.. 답답해 지네요.. ㅜ.ㅜ; 이런 형태의 문제가 처음이 아니고, 여러번 있었다는 겁니다. 처음에는 그러려니 했으나.. 하면 할수록 이건 좀 심하지 않나 싶어서 적어봅니다. 이런 문제를 해결할 방법이 있을까요??캐시 때문인지, 다르면 다른 설정으로 근본적으로 개발할때라도 해결할 방법이 있으면 알려주시면 감사하겠습니다..
-
해결됨[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
macro=true 는 뭔가요?
강의 잘 보고 있습니다.nuxt3가 버전없이 되어서 그런지, 강의에서는 안 보이는 _nuxt/pages/index.vue?macro=true 이런게 많이 보입니다.라우팅을 확인하기 위해서 개발자 도구의 network에서 보면 이런 코드가 다 들어가 보이는데..이건 뭐며, 로딩이 안되게나 해당 페이지 사용시 로드하는 형태는 불가능한가요??home으로 이동시 index.vue 로드해서 가져오고, about 클릭시 about.vue를 정상적으로 로드해서 정상적으로 code split이 이루어지고 있는 상태인데.. 해당 페이지를 리로드해서 가져오면.. 이처럼 pages 밑에 있는 모든 파일의 macro=true로 다 가져오고 있거든요..알려주시면 감사하겠습니다.. 아.. 코드 오류 발생시 저 macro=true 붙은 것을 화면에 많이 뿌려주어서 더 궁금합니다..
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
퀘이사 설치 후 오류
퀘이사 설치 후nuxt.config.ts에모듈을 추가하면 [vite-node] [ERR_LOAD_URL] quasar/lang/en-US.mjs오류가 뜨네요2번쨰 복습중인데 처음에는 잘 됐던거같은데 왜 갑자기 안되는걸까요?
-
해결됨[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
nuxt3에서 javascript 사용하려면 어떻게 해야 하나요?
nuxt3에서는 typescript를 사용해야 하는것은 알고 있는데, 외부 모듈 연동이나 기타 연동등에서 어쩔수 없이 자바스크립트를 사용해야 하는 경우가 있을건데, 이때 자바스크립트를 어떻게 가져와 처리해야 하는지 알고 싶습니다.우선 간단히 예제를 구성했는데.. 간단한것도 안되네요.. ㅡ.ㅜ; <template> <div> <h1>{{ data.message }}</h1> <p>Today is: {{ data.date }}</p> </div> </template> <script setup lang="ts"> import { ref } from 'vue'; import { fetchData } from '/assets/js/javascript_test'; const data = ref(fetchData()); </script>// assets/js/javascript_test.js export default function () { return { message: "Hello from JavaScript", date: new Date().toDateString(), }; }이처럼 구성했을때, 어떻게 가져와서 처리해야 하는지 좀 알려주시면 감사하겠습니다.500 에러 뜨는데, 이 코드 작동 좀 하게 해 주세요.. ㅡ.ㅜ;
-
해결됨[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
.eslintrc.cjs 설정시 반대로 되는데, 혹 왜 이런지 아시는지요?
vscode와 eslint를 자주 사용하는데.. 이번에 이상해서 질문 드립니다.. ㅡ.ㅜ;우선 강의 내용대로 설정을 하고 있는데.. workspace에 vscode의 settings.json로 생성해서 알려주신거 붙여넣기 하고...eslintrc.cjs 파일로 이동해서 ctrl+s로 저장을 하면 space->tab으로, 싱글쿼터가 더블쿼터로 바뀝니다.즉, 반대로 되는거죠.. 'prettier/prettier': [ 'error', { arrowSpacing: ['error', { before: true, after: true }], singleQuote: true, semi: true, useTabs: false, tabWidth: 2, trailingComma: 'all', printWidth: 80, bracketSpacing: true, arrowParens: 'always', endOfLine: 'auto', }, ],강의 교안 그대로 붙여넣기 해서 하고 있는데.. 이처럼 설정되어 있는데.. 왜 이런지 혹시 아실까요?? 이전부터 싱글쿼터에 useTabs는 false로 해서 코딩하고 있으며, vscode의 전체의 settings.josn에는 eslint 관련된 것은 없습니다.물론 위 설정에서 그냥 useTabs를 true로 하고, singleQuote를 false로 하면 정상적으로 작동 할거 같기는 한데.. 왜 이런지는 꼭 알고 싶어서 적어봅니다.설정등은 교안 그래도 했는데.. 혹 패키지 버전이나 그런 문제로 이런 문제가 발생할 수도 있을까요??혹 짚히시는게 있을까 싶어 질문 올려 봅니다..
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
메타 태그 질문입니다.
안녕하세요Nuxt3를 이용해서 서비스를 개발중인 수강생입니다. 저는 middleware단에 useSeoMeta를 사용해서, 각 페이지별로 메타태그가 들어가게 해놓고,일부 페이지는 axios 모듈로 api 서버에 request하고 response받은 값을 useHead()를 통해 meta태그로 설정하려고 하고 있습니다. 빌드해서 확인해보니, 콘솔에는 해당 페이지에 사용하고자 하는 메타태그가 잘 찍히는데, 막상 페이스북 공유하기 버튼이나 카카오톡에 링크를 붙여넣는등의 행위를 할때 이미지나 타이틀등이 안보입니다. 미들웨어에서 페이지의 메타태그를 한번 씌워놓으면 해당 pages 폴더의 vue파일에서 다시 메타태그 설정이 안되는지 궁금하고, api response값을 메타태그에 사용하려면 어떻게 하는지 궁금합니다. 크롬 개발자도구에서 head 부분을 보면, 메타 태그는 잘 들어가 있는걸 확인할 수 있었습니다.
-
미해결Vue 3 시작하기
같은 레벨 자식에서의 이벤트 핸들링 방법 문의
섹션 3. Vue.js 컴포넌트 - Vue Component 통신방식에서 뷰는 항상 단방향으로(부모 -> 자식 = props, 자식 => 부모 = emit)으로 흐른다고 하셨는데요.예를들어 A아래 B,C 컴포넌트가 있고, C 화면에 있는 버튼을 클릭하면 B에 어떤 액션이 일어나야한다고 하면 아래와 같이 설계하는게 맞는것인가 궁금합니다.B->A emit 이벤트 발생A에서 B로부터 전달받은 이벤트 핸들링으로 C에 내리고있는 toggle형 props 값 업데이트C에서 A에서 내린 props를 watch하고 있다가 값이 변경되면 액션 수행제가 구상한 방식이 위와같은데 이게 최선인지 궁금합니다..다른 좋은 방법이 있다면 조언 부탁드립니다.
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
clearError 와 error.value = null
선생님 안녕하세요! 좋은 강의 잘 듣고 있습니다.에러를 초기화하는 과정에서 궁금증이 생겨 질문 드립니다.NuxtErrorBoundary에서의 error는 clearError() 로는 제거할 수 없는걸까요? <q-btn label="Reset" color="positive" no-caps @click="error.value = null" /> </template> 위 코드에서 @click="error.value = null" 대신에@click="clearError({ redirect: '/course'})" 로 바꾸어 테스트 해보았는데, 페이지 이동이 되지 않습니다.clearError() 와 error.value = null; 에는 어떤 차이가 있는 것일까요?
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
tiptap 스타일 파일은 따로 안 올려주시나요?
Tiptap Editor 강의를 듣다가 스타일 파일은 말씀으로는 자료에 올려주신다고 하셨지만, 자막을 보니 직접 타이핑을 하라고 말씀하시는 것 같아서요.따로 스타일 파일은 안 올려주시나요?
주간 인기글
순위 정보를
불러오고 있어요