인프런 닉네임: 놀란 호랑이인프런 이메일: madeleineluv@kakao.com깃 이메일: apple380g@gmail.com깃 닉네임: Hell0Stranger 깃 권한 요청드려요 :)

안녕하세요.자식 컴포넌트에서 부모 컴포넌트로 emit을 사용해서 event를 전달하는 내용을 실습하고 있습니다.강사님을 따라서 자식컴포넌트에서 전달하는 event명을 createPost(카멜케이스)로 작성하고 부모컴포넌트에서event 리스터에는 create-post(케밥케이스) 로 입력했는데 이벤트가 실행이 안됐습니다. 그러다가 둘다 케밥 케이스로 통일하니깐이벤트가 실행이 잘 되더라구요. 왜그런 건지 알수 있을까요?

버튼 클릭을 해 이벤트를 발생시켰음에도 불구하고 개발자도구에는 No events라고 뜹니다.Timeline에서 record 버튼 눌러 record on 했음에도 마찬가지입니다.해결방법을 아실까요? ㅠㅠ 

PS C:\Users\97gyu\OneDrive\바탕 화면\폴더\이규성\깃허브\vue-project> npm i vite npm error code 3221225477npm error path C:\Users\97gyu\OneDrive\바탕 화면\폴더\이규성\깃허브\vue-project\node_modules\esbuildnpm error command failednpm error command C:\WINDOWS\system32\cmd.exe /d /s /c node install.jsnpm error A complete log of this run can be found in: C:\Users\97gyu\AppData\Local\npm-cache\_logs\2024-12-16T13_10_50_883Z-debug-0.logPS C:\Users\97gyu\OneDrive\바탕 화면\폴더\이규성\깃허브\vue-project>   npm install -g npm 2npm cache clean --forcev22.12.0 node -v 버전입니다 어떠한 오류 인지 알 수 있을까요? 검색 후 시도를 해보았는데 안되네요 ㅠ

onCreateUser와 onDeleteUser 함수 작성 후 에뮬레이터를 실행하면functions.region is not a function이라고 로그에 나오고 있는데혹시 firebase-functions 버전 문제일까요??ㅠㅠ어떻게 해결 해야할 지 모르겠어요ㅠㅠ 도움 부탁드립니다~

개발자도구에서 vue탭이 안보입니다. 버전이 여러게 있길래 다 시도해봤는데도 안보이네요. 현재는 legacy 버전을 설치한 상태이고, 파일 url액세스 허용도 체크되어 있습니다.여전히 vue탭은 개발자도구에서 안나타나네요.  가이드를 부탁드립니다.

[plugin:vite:import-analysis] Failed to resolve import "vue-router" from "src/router/index.js". Does the file exist? import { createRouter, createWebHistory } from 'vue-router'vue-router를 불러올 수 없는데 어떻게 해야될까요?

import './assets/main.css' import 'bootstrap/dist/bootstrap.min.css' import 'bootstrap-icons/font/bootstrap-icon.css' import { createApp } from 'vue' import App from './App.vue' createApp(App).mount('#app') import 'bootstrap/dist/js/bootstrap.js' [plugin:vite:import-analysis] Failed to resolve import "bootstrap/dist/bootstrap.min.css" from "src/main.js". Does the file exist?1 | import './assets/main.css' 2 | 3 | import 'bootstrap/dist/bootstrap.min.css' | ^ 4 | import 'bootstrap-icons/font/bootstrap-icon.css' 5 | import { createApp } from 'vue' 이런 에러가 발생합니다.부트스트랩 설치 시 bootstrap.min.css 파일이 존재하지 않는데 어떻게해야하나요?

 install도 잘 했습니다. npm i -D unplugin-vue-router router>index.js도 강의와 같이 설정했고요. 이유를 모르겠습니다.

질문은 자세하게 적어주실 수록 좋습니다. 어느 부분을 수강중이신지 -> bmi 계산기 프로그램 완성하기 내가 어떻게 했는데, 어떤 결과가 나오기를 기대했는데, 다른 결과가 나왔는지 -> 노션의 코드들을 다 복사해서 붙여넣기 했는데 homepage 영역이 안나옵니다작성하신 코드 및 오류 스크린샷 을 함께 첨부해주시면 좋아요!

 Vue CLI v5.0.8✨ Creating project in /Users/yeji/Desktop/2-17__/myfirestvuewapp.⚙ Installing CLI plugins. This might take a while...npm error code EACCESnpm error syscall opennpm error path /Users/yeji/.npm/_cacache/tmp/e7f990dfnpm error errno EACCESnpm errornpm error Your cache folder contains root-owned files, due to a bug innpm error previous versions of npm which has since been addressed.npm errornpm error To permanently fix this problem, please run:npm error sudo chown -R 501:20 "/Users/yeji/.npm"npm error Log files were not written due to an error writing to the directory: /Users/yeji/.npm/_logsnpm error You can rerun the command with --loglevel=verbose to see the logs in your terminalERROR Error: command failed: npm install --loglevel error --legacy-peer-depsError: command failed: npm install --loglevel error --legacy-peer-depsat ChildProcess.<anonymous> (/usr/local/lib/node_modules/@vue/cli/lib/util/executeCommand.js:138:16)at ChildProcess.emit (node:events:518:28)at maybeClose (node:internal/child_process:1104:16)at ChildProcess._handle.onexit (node:internal/child_process:304:5)yeji@gim-yejiui-MacBookPro 2-17__ % sudo npm i -g @vue/cli;2A

문서 자료가 있나요?

인프런 아이디 : tm.jung인프런 이메일 : tm.jung@brainz.co.kr깃헙 아이디 : kcw2371@gmail.com깃헙 Username : kcw2297

안녕하세요.이전 eslintrc에서 사용한 process.env.NODE_ENV를 eslint.config.js에 적용하는 방법을 알고싶습니다.

배열이나 객체를 사용할 때는 reactive()를 사용하는 것으로 알고있습니다. 해당 코드에서는 reactive([]) 대신 ref([])를 사용했더라구요.const checkboxValues = ref([]) reactive([])를 사용하니 checkbox에 v-model이 제대로 동작하지 않았습니다. 그 이유는 무엇인가요?  

plugins { id 'java' id 'org.springframework.boot' version '3.0.5' id 'io.spring.dependency-management' version '1.0.11.RELEASE' id "org.asciidoctor.jvm.convert" version "3.3.2" } group = 'org.spring' version = '0.0.1-SNAPSHOT' sourceCompatibility = '17' configurations { compileOnly { extendsFrom annotationProcessor } asciidoctorExt } repositories { mavenCentral() } ext { snippetsDir = file('build/generated-snippets') } dependencies { implementation 'org.springframework.boot:spring-boot-starter-data-jpa' implementation 'org.springframework.boot:spring-boot-starter-web' implementation 'org.springframework.boot:spring-boot-starter-validation' implementation 'org.springframework.security:spring-security-crypto' implementation 'org.springframework.session:spring-session-jdbc' implementation 'org.springframework.boot:spring-boot-starter-security' implementation 'org.springframework.security:spring-security-test' implementation 'org.bouncycastle:bcprov-jdk15on:1.70' implementation 'com.querydsl:querydsl-core:5.0.0' implementation 'com.querydsl:querydsl-jpa:5.0.0:jakarta' annotationProcessor "com.querydsl:querydsl-apt:5.0.0:jakarta" annotationProcessor 'jakarta.persistence:jakarta.persistence-api' annotationProcessor 'jakarta.annotation:jakarta.annotation-api' implementation 'io.jsonwebtoken:jjwt-api:0.11.5' runtimeOnly 'io.jsonwebtoken:jjwt-impl:0.11.5' runtimeOnly 'io.jsonwebtoken:jjwt-jackson:0.11.5' annotationProcessor "org.springframework.boot:spring-boot-configuration-processor" asciidoctorExt "org.springframework.restdocs:spring-restdocs-asciidoctor:3.0.0" testImplementation "org.springframework.restdocs:spring-restdocs-mockmvc:3.0.0" annotationProcessor "org.springframework.boot:spring-boot-configuration-processor" compileOnly 'org.projectlombok:lombok' annotationProcessor 'org.projectlombok:lombok' testCompileOnly "org.projectlombok:lombok" testAnnotationProcessor "org.projectlombok:lombok" runtimeOnly 'com.h2database:h2' testImplementation 'org.springframework.boot:spring-boot-starter-test' implementation 'org.modelmapper:modelmapper:3.2.0' } tasks.named('test') { useJUnitPlatform() } test { outputs.dir snippetsDir } asciidoctor { inputs.dir snippetsDir configurations 'asciidoctorExt' dependsOn test } asciidoctor.doFirst { delete file("src/main/resources/static/docs") } bootJar { enabled = true dependsOn asciidoctor copy { from asciidoctor.outputDir into "src/main/resources/static/docs" } } jar { enabled = false }  FAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':compileJava'.> Compilation failed; see the compiler error output for details.* Try:> Run with --info option to get more log output.> Run with --scan to get full insights.BUILD FAILED in 6s     안녕하세요querydsl 빌드 후 Q class 임포트 하는 곳에서 에러가 발생합니다 ㅠ구글링해서 이런 저런 방법 찾아서 혼지사 해보려고 했는데 쉽지않네요.. 그 밖에 캐시 지우고 재시작, java SDK 설정, 빌드설정 등 여러가지 방법을 해보았는데 잘 안됩니다 ㅠ두세시간 정도 삽질중인데 도움 좀 주실 수 있을까요.. 

@submit.prevent="edit"이와 같이 submit을하면 form내의 @click이벤트가 선언되지 않은 버튼을 여러개 만들어 각각 클릭해도 동작하는것을 확인했는데 submit 동작이 이러한게 맞는건가요? 다른 질문입니다..Listview 내 소스입니다. <PostDetailView :id="String(initId)"></PostDetailView>const initId = ref(); const fetchPosts = async () => { try { const { data, headers } = await getPosts(params.value); initId.value = data[0].id; posts.value = data; totalCount.value = headers['x-total-count']; } catch (e) { console.error('error', e); } };이런식으로 initId를 생성해서 넣어주려 했지만 id가 undefined로 초기에 전송이되고 detailView에서 당연히 에러를 내뱉었습니다.하지만 initId가 반응형으로서 fetchPosts에서 바뀌면 detailView가 다시 랜더링되어서 나와야할거같은데 안나오네요..개발자도구에서 initId값을 바꿔도 랜더링이 안되는 이유를 모르겠습니다 ....(결국v-if로 해결하긴했지만.. 또한 같은 원리로 AppPagination에서는 pageCount가 초기값이 0인데 fetchPosts를 호출후에 값이 바뀌니 다시 랜더링이 되어서 불러와지는것 같은데 제가 개념을 잘못알고있는걸까요)

<PostDetailView :id="1"></PostDetailView>main.js:8 [Vue warn]: Invalid prop: type check failed for prop "id". Expected String with value "1", got Number with value 1. at <PostDetailView id=1 > at <AppCard> at <PostListView onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > at <RouterView> at <TheView> at <App> 위처럼 사용하는 경우 경고창이 표시가 됩니다.. 또한 <PostDetailView :id="abc"></PostDetailView>위처럼 abc를 id값으로 주면 undefined가 뜨는데 왜그럴까요?

// form.value = { ...data }; form.value = data;두개의 차이점이 궁금합니다.

안녕하세요, 호돌님. Windows11 Home Edition 사용 유저입니다. 강의 보면서 Vue 개발 환경 조성 부분에서 막막했는데, 커뮤에 언급하신 WSL로 구글링 하면서 npm dev 서버까지 띄웠습니다. 하루 온종일 구글링 보면서 삽질을 한거라 그냥 날리기는 아깝고 제 방식이 저같은 분들께 도움이 좀 되었으면 해서 정리한 내용 올립니다. https://blog.naver.com/hellom0501/223652563722 다만 WSL의 특성상 윈도우와 마운트 된 파티션에서의 빌드나 npm 작업은 엄청난 속도 저하가 발생합니다.딱히 개선점은 없는 것 같고, WSL2를 WSL1으로 다운 그레이드하면 나아질 것이라고 해서 수정해봤는데 체감되진 않네요.아니면 아예 WSL 내부에서 개발 환경을 구축하고 작업을 하는 수 밖에 없는 것 같습니다. 좋은 강의 감사합니다.