묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨풀스택 리액트 라이브코딩 - 간단한 쇼핑몰 만들기
리액트 버전업데이트에 관해 문의드려요
안녕하세요 리액트로 웹개발 시작한 6개월차 신입개발자 입니다. 강의 정말 잘 보고있는데 너무 감사하게도 우연히 저희 안건과 개발환경이 많이 겹쳐서 큰 도움받고있습니다! 현재 안건에서 쓰는 리액트버전이 15.6.1인데 이번에 최신버전 v18.2.0로 업데이트하는 미션이 떨어졌는데어떻게 헤쳐나가야할지 너무 답답해서 고민끝에 질문드립니다...현재 안건의 스펙입니다. ・안건종류: 데이트 매칭 어플・메인언어: react・상태관리: redux・프레임워크 : koa・미들웨어: redux-thunk ======== 개요 ======== 일단 검색으로는 잘 정리된곳 찾기가 어려워서 리액트공식문서와 책 위주로 참고해서 정리중인데요, 우선 큰 틀을 짜고 문제점들을 세분화하면서 틀을 좁혀가려고합니다.. react, react-dom 최신버전 인스톨후에러를 우선순위별로 리스트화 하기・ReactDOM.render is no longer supported in React 18. Use createRoot instead.・Warning: componentWillMount has been renamed, and is not recommended for use.・componentWillReceiveProps has been renamed・You have triggered an unhandledRejection, you may have forgotten to catch a Promise rejection공동작업을 위한 규칙 리스트화 하기 ・class 컴포넌트 → function 컴포넌트로 변경・life cycle → useEffect 로 처리, 또는 커스텀 hook・react-redux 의 connect 함수 → useSelector, useDispatch Hooks로 리덕스와 컴포넌트 연동・state 업데이트시 불변성을위한 spread 연산자, immer 사용・코드 스플리팅: 라우팅에 React.lazy or Suspense 적용・react-redux 디렉토리 구조: 일반구조(component, container, reducer)-> ducks 패턴 사용해서 파일 모듈화의존중인 라이브러리및 패키지 업데이트 2와 3을 진행하며 기타 에러를 해결 ======== 질문 ========3번의 [공동작업을 위한 규칙 리스트화]의 경우, 검색과 에러기준으로 만들고있는데 너무 부족한것같습니다. 프로젝트 버전 업그레이드시, 기준이 되는 컨텐츠가 있는지 궁금합니다.현재 리액트 구버전 15부터 16,17,18 최신버전까지의 모든 업데이트 변경점을 체크해서 일일이 적용해야하는지(←React공식문서블로그에서), 단순히 15->18로 점프해서 바뀐사항만 적용해도되는지현재 구버전에서 사용중인 각종 패키지, 라이브러리 업데이트는 어떤 방향으로 진행해야할지-> 이부분이 제일 손대기 어려울정도로 막막합니다. 리액트버전업뎃처럼 똑같이 최신버전인스톨, 에러체크, 버전별 변경점 체크후 적용및 수정 하면 될까요? 입사 3개월차에 선배나 가이드없이 진행중이라 정말 고민끝에 질문드립니다…혹시 시간나실때 답변이나 조언해주시면 정말 감사하겠습니다……(살려주세요…..)잘부탁드려요 ! (제발 구원의 손길을 ㅠㅠㅠ) package.json (react만 최신인스톨)"dependencies": { "@paypal/paypal-js": "4.1.0", "babel-runtime": "^6.25.0", "chart.js": "^2.6.0", "classnames": "^2.2.3", "es6-promise": "^4.1.1", "exif-js": "^2.2.1", "firebase": "^7.7.0", "history": "^3.3.0", "koa": "^1.2.0", "koa-static": "^2.0.0", "lodash.reverse": "^4.0.1", "lodash.sortby": "^4.5.0", "lodash.throttle": "^4.0.0", "lodash.uniqby": "^4.5.0", "moment": "^2.17.0", "moment-timezone": "^0.5.13", "node-fetch": "^2.6.6", "normalizr": "^2.3.0", "object-assign": "^4.0.1", "pm2": "^2.6.1", "prop-types": "^15.5.10", "react": "^18.2.0", "react-chartjs-2": "^2.5.6", "react-dom": "^18.2.0", "react-ga": "^2.1.2", "react-helmet": "^5.1.3", "react-infinite-scroller": "^1.2.4", "react-redux": "^5.0.2", "react-router": "^3.0.5", "react-router-redux": "^4.0.1", "react-router-scroll": "^0.4.1", "react-scroll": "1.5.4", "react-slick": "^0.14.5", "react-swipeable": "^4.0.1", "react-textarea-autosize": "^5.0.6", "redux": "^3.7.2", "redux-actions": "^2.2.1", "redux-api-middleware": "^1.0.3", "redux-logger": "^3.0.6", "redux-thunk": "^2.4.0" }, "devDependencies": { "babel-cli": "^6.7.5", "babel-eslint": "^8.2.3", "babel-plugin-espower": "^2.3.1", "babel-plugin-module-resolver": "^4.1.0", "babel-plugin-transform-async-to-generator": "^6.24.1", "babel-plugin-transform-class-properties": "^6.6.0", "babel-plugin-transform-export-extensions": "^6.22.0", "babel-plugin-transform-object-rest-spread": "^6.23.0", "babel-plugin-transform-runtime": "^6.15.0", "babel-preset-es2015": "^6.6.0", "babel-preset-react": "^6.3.13", "babel-register": "^6.7.2", "babelify": "^7.3.0", "browserify": "^13.0.0", "css-mqpacker": "^6.0.1", "csswring": "^6.0.0", "envify": "^4.1.0", "eslint": "^4.19.1", "eslint-config-tapplint": "^2.0.1", "eslint-config-tapplint-react": "^1.0.0", "eslint-plugin-react": "7.4.0", "gulp": "^3.9.0", "gulp-consolidate": "^0.2.0", "gulp-htmlmin": "^3.0.0", "gulp-iconfont": "^8.0.0", "gulp-imagemin": "^3.3.0", "gulp-notify": "^3.0.0", "gulp-plumber": "^1.0.1", "gulp-postcss": "^6.4.0", "gulp-rename": "^1.2.2", "gulp-sketch": "^1.0.5", "gulp-sourcemaps": "^2.0.0", "husky": "^0.14.3", "karma": "^1.1.0", "karma-browserify": "^5.0.5", "karma-chrome-launcher": "^2.2.0", "karma-mocha": "^1.0.1", "karma-mocha-reporter": "^2.0.3", "lint-staged": "^7.2.2", "lodash": "^4.11.1", "md5-file": "^4.0.0", "mocha": "^3.5.0", "postcss": "^5.2.17", "postcss-cssnext": "^3.1.1", "postcss-import": "^10.0.0", "postcss-media-variables": "^2.0.0", "postcss-nesting": "^2.3.1", "power-assert": "^1.4.4", "react-addons-test-utils": "~15.6.0", "react-prefixr": "^0.1.0", "require-dir": "^0.3.2", "stylelint": "^7.13.0", "stylelint-config-standard": "^16.0.0", "stylelint-order": "^0.5.0", "tapplint": "^0.9.0", "terser": "^4.6.11", "uglifyify": "^5.0.2", "watchify": "^3.7.0", "yargs": "^6.0.0" }
-
미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
리액트 버전업데이트에 관해 문의드립니다.
안녕하세요 리액트로 웹개발 시작한 6개월차 신입개발자 입니다. 강의 정말 잘 보고있는데 너무 감사하게도 우연히 저희 안건과 개발환경이 많이 겹쳐서 큰 도움받고있습니다! 현재 안건에서 쓰는 리액트버전이 15.6.1인데 이번에 최신버전 v18.2.0로 업데이트하는 미션이 떨어졌는데어떻게 헤쳐나가야할지 너무 답답해서 고민끝에 질문드립니다...현재 안건의 스펙입니다. ・안건종류: 데이트 매칭 어플・메인언어: react・상태관리: redux・프레임워크 : koa・미들웨어: redux-thunk ======== 개요 ======== 일단 검색으로는 잘 정리된곳 찾기가 어려워서 리액트공식문서와 책 위주로 참고해서 정리중인데요, 우선 큰 틀을 짜고 문제점들을 세분화하면서 틀을 좁혀가려고합니다.. react, react-dom 최신버전 인스톨후 에러를 우선순위별로 리스트화 하기・ReactDOM.render is no longer supported in React 18. Use createRoot instead.・Warning: componentWillMount has been renamed, and is not recommended for use.・componentWillReceiveProps has been renamed・You have triggered an unhandledRejection, you may have forgotten to catch a Promise rejection공동작업을 위한 규칙 리스트화 하기 ・class 컴포넌트 → function 컴포넌트로 변경・life cycle → useEffect 로 처리, 또는 커스텀 hook・react-redux 의 connect 함수 → useSelector, useDispatch Hooks로 리덕스와 컴포넌트 연동・state 업데이트시 불변성을위한 spread 연산자, immer 사용・코드 스플리팅: 라우팅에 React.lazy or Suspense 적용・react-redux 디렉토리 구조: 일반구조(component, container, reducer)-> ducks 패턴 사용해서 파일 모듈화의존중인 라이브러리및 패키지 업데이트 2와 3을 진행하며 기타 에러를 해결 ======== 질문 ========3번의 [공동작업을 위한 규칙 리스트화]의 경우, 검색과 에러기준으로 만들고있는데 너무 부족한것같습니다. 프로젝트 버전 업그레이드시, 기준이 되는 컨텐츠가 있는지 궁금합니다.현재 리액트 구버전 15부터 16,17,18 최신버전까지의 모든 업데이트 변경점을 체크해서 일일이 적용해야하는지(←React공식문서블로그에서), 단순히 15->18로 점프해서 바뀐사항만 적용해도되는지 현재 구버전에서 사용중인 각종 패키지, 라이브러리 업데이트는 어떤 방향으로 진행해야할지-> 이부분이 제일 손대기 어려울정도로 막막합니다. 리액트버전업뎃처럼 똑같이 최신버전인스톨, 에러체크, 버전별 변경점 체크후 적용및 수정 하면 될까요? 입사 3개월차에 선배나 가이드없이 진행중이라 정말 고민끝에 질문드립니다…혹시 시간나실때 답변이나 조언해주시면 정말 감사하겠습니다……(살려주세요…..)잘부탁드려요 ! (제발 구원의 손길을 ㅠㅠㅠ) package.json (react만 최신인스톨)"dependencies": { "@paypal/paypal-js": "4.1.0", "babel-runtime": "^6.25.0", "chart.js": "^2.6.0", "classnames": "^2.2.3", "es6-promise": "^4.1.1", "exif-js": "^2.2.1", "firebase": "^7.7.0", "history": "^3.3.0", "koa": "^1.2.0", "koa-static": "^2.0.0", "lodash.reverse": "^4.0.1", "lodash.sortby": "^4.5.0", "lodash.throttle": "^4.0.0", "lodash.uniqby": "^4.5.0", "moment": "^2.17.0", "moment-timezone": "^0.5.13", "node-fetch": "^2.6.6", "normalizr": "^2.3.0", "object-assign": "^4.0.1", "pm2": "^2.6.1", "prop-types": "^15.5.10", "react": "^18.2.0", "react-chartjs-2": "^2.5.6", "react-dom": "^18.2.0", "react-ga": "^2.1.2", "react-helmet": "^5.1.3", "react-infinite-scroller": "^1.2.4", "react-redux": "^5.0.2", "react-router": "^3.0.5", "react-router-redux": "^4.0.1", "react-router-scroll": "^0.4.1", "react-scroll": "1.5.4", "react-slick": "^0.14.5", "react-swipeable": "^4.0.1", "react-textarea-autosize": "^5.0.6", "redux": "^3.7.2", "redux-actions": "^2.2.1", "redux-api-middleware": "^1.0.3", "redux-logger": "^3.0.6", "redux-thunk": "^2.4.0" }, "devDependencies": { "babel-cli": "^6.7.5", "babel-eslint": "^8.2.3", "babel-plugin-espower": "^2.3.1", "babel-plugin-module-resolver": "^4.1.0", "babel-plugin-transform-async-to-generator": "^6.24.1", "babel-plugin-transform-class-properties": "^6.6.0", "babel-plugin-transform-export-extensions": "^6.22.0", "babel-plugin-transform-object-rest-spread": "^6.23.0", "babel-plugin-transform-runtime": "^6.15.0", "babel-preset-es2015": "^6.6.0", "babel-preset-react": "^6.3.13", "babel-register": "^6.7.2", "babelify": "^7.3.0", "browserify": "^13.0.0", "css-mqpacker": "^6.0.1", "csswring": "^6.0.0", "envify": "^4.1.0", "eslint": "^4.19.1", "eslint-config-tapplint": "^2.0.1", "eslint-config-tapplint-react": "^1.0.0", "eslint-plugin-react": "7.4.0", "gulp": "^3.9.0", "gulp-consolidate": "^0.2.0", "gulp-htmlmin": "^3.0.0", "gulp-iconfont": "^8.0.0", "gulp-imagemin": "^3.3.0", "gulp-notify": "^3.0.0", "gulp-plumber": "^1.0.1", "gulp-postcss": "^6.4.0", "gulp-rename": "^1.2.2", "gulp-sketch": "^1.0.5", "gulp-sourcemaps": "^2.0.0", "husky": "^0.14.3", "karma": "^1.1.0", "karma-browserify": "^5.0.5", "karma-chrome-launcher": "^2.2.0", "karma-mocha": "^1.0.1", "karma-mocha-reporter": "^2.0.3", "lint-staged": "^7.2.2", "lodash": "^4.11.1", "md5-file": "^4.0.0", "mocha": "^3.5.0", "postcss": "^5.2.17", "postcss-cssnext": "^3.1.1", "postcss-import": "^10.0.0", "postcss-media-variables": "^2.0.0", "postcss-nesting": "^2.3.1", "power-assert": "^1.4.4", "react-addons-test-utils": "~15.6.0", "react-prefixr": "^0.1.0", "require-dir": "^0.3.2", "stylelint": "^7.13.0", "stylelint-config-standard": "^16.0.0", "stylelint-order": "^0.5.0", "tapplint": "^0.9.0", "terser": "^4.6.11", "uglifyify": "^5.0.2", "watchify": "^3.7.0", "yargs": "^6.0.0" }
-
해결됨다양한 사례로 익히는 SQL 데이터 분석
복원 관련 질문
안녕하세요,설치 관련해서 문의 드릴려고 합니다.맥북m1 유저인데 공유해주신 backup 파일을 업로드 하려고 하는데 아래 사진과 같이 'start' 버튼이 활성화 되지 않아서 문의 드립니다. 감사합니다.
-
미해결실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
안녕하세요
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.1. 강의 내용과 관련된 질문을 남겨주세요.2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.(자주 하는 질문 링크: https://bit.ly/3fX6ygx)3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.=========================================[질문 템플릿]1. 강의 내용과 관련된 질문인가요? (예/아니오)2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)[질문 내용]아래 두 가지 방식의 연결 방식 차이가 궁금합니다jdbc:h2:~/jpashopjdbc:h2:tcp://localhost/~/jpashop
-
미해결프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)
강의자료 부탁드립니다!
강의자료 부탁드립니다!rhkdah0319@naver.com
-
미해결피그마(Figma)를 활용한 UI디자인 입문부터 실전까지 A to Z
auto layout해제방법 질문드립니다
안녕하세요사진과 같이 여러 개의 이미지를 auto layout지정하니까 한 묶음이 되어 같이 이동하는데요이미지를 다시 각각 따로 이동시키고 싶은데 auto layout해제 단축키를 눌러도 서로 분리가 안되네요이 경우 좋은 방법이 있을지 질문드립니다감사합니다
-
미해결설계독학맛비's 실전 FPGA를 이용한 HW 가속기 설계 (LED 제어부터 Fully Connected Layer 가속기 설계까지)
vivado에서 프로젝트 생성 시 zybo-z7-20 이 사라진 현상 => 결과
프로젝트 생성을 하다 zybo-z7-20이 사라지는 현상이 발생 하였습니다.보드 설정 시 벤더: 디질런트 , 서치 : zybo 까지 검색을 하면 zybo z7-10 ver1.0 zybo z7-20 ver1.1 이렇게 검색이 되었습니다. 다른 수강생분 질문도 확인을 하였지만 해결되지 않았습니다.그러다가 zybo z7-10 의 status 란에 다운로드 표시를 누르고 나니 zybo z7-20이 아래 그림처럼 다시 나타났습니다. 정확히 다운로드 하나로 해결이 된건지 어떤 경로로 해결이 된건지는 모르겠지만(C:\Xilinx\Vivado\2022.1\data 아래에 보드 파일 폴더를 만들어 넣기도 하였음) 혹시 문제 발생 시 시도는 해볼 수 있을꺼라 생각이 들어 글 남겨 봅니다.
-
미해결프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)
강의자료 요청드립니다.
안녕하세요.강의자료가 둘 다 빈 파일로 나와서 메일로 요청드립니다.hjlol818@naver.com감사합니다~
-
미해결스프링 시큐리티
프로젝트 홈 화면 페이지
홈 화면 대시보드 페이지에서 로고가 무슨 짓을 해도 안뜹니다.이 부분이요. 다른 페이지도 마찬가지인데 소스 확인해보고 올려주신 걸까요..?그게 아니라면 다른 화면이 뜨는게 정상인 걸까요? 다른 분들은 어떻게 뜨시는지 궁금합니다.
-
미해결10주완성 C++ 코딩테스트 | 알고리즘 코딩테스트
교안 공부 + unique()질문
C를 어느정도 하고 바로 C++ 교안을 공부하고 있는 중입니다.초반에 예제에서 벡터를 모르는 상태에서 벡터가 나와서아 벡터는 대충 배열이랑 비슷한 무언가겠구나 생각하면서 예제를 이해해가면서 공부를 하고있었습니다. 그런데 가면 갈수록 예제들이 이해가 안가는데 이게 당연한거죠?unique()가 중복되는 요소를 제거하고 중복되지 않은 요소들로 앞에서부터 정렬되어 채우고나머지 요소들은 삭제하지 않고 둔다는 말은 1 1 2 2 3 3 4 4 5 51 2 3 4 5 3 4 4 5 5중복되는 1 2 3 4 5를 제거하고 앞에서부터 정렬되어 채우면 1 2 3 4 5 가 된다는 말인건 이해했고 1 2 3 4 5 뒤에 ㅁ ㅁ ㅁ ㅁ ㅁ 자리에 왜 3 4 4 5 5가 오는지 모르겠습니다.그냥 단순하게 앞에 지워진 갯수만큼 앞으로 땡기고 남은 자리수는 그냥 원래 데이터에서 뒤에 남은 5자리가 3 4 4 5 5이니 그냥 이걸 그대로 두면 된다는 말인가요?3일에서 14일 걸린다는데 예제를 이해를 못하니 제가 멍청한건지 약간 자괴감이 드네요이 문제뿐만 아니라 다른 예제도 학습을 하지 않은 개념들이 섞이는데 벡터에 대한 이론을 아직 공부를 하지 않아서 제가 잘 모르는거죠?공부를 하고 다시 위로 돌아가면 이해하겠죠?
-
미해결실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
OrderRepository를 사용하는 이유
안녕하세요~좋은 강의를 위해서 항상 노력해주셔서 감사합니다 :)수업을 듣다가 갑자기 궁금한것이 있어서 질문드립니다!지금 강의에서는 OrderSimpleApiController 에서 OrderRepository 를 Service 를 거치지 않고 의존하고 있는데 Service 를 거칠 만큼 로직이 복잡하지 않아서 repository 에서 바로 가져다 사용한 것이 맞을까요??
-
미해결
아톰 오류
설정부분에서 이렇게 뜨는데 어떻게 하면되죠
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
Docker compose image 옵션
안녕하세요. Docker-compose services 옵션 중에 image에 대해 궁금한 점이 있습니다.강의에서 mongoDB dockerfile에는 'FROM mongo:5' 이렇게만 작성했는데 이걸 image옵션으로 허브에서 가져오면 dockerfile없이 docker-compose를 할 수 있는건지 궁금합니다.image 옵션과 build옵션을 둘 중 하나만 사용해야하는건지image옵션을 쓰면 dockerfile이 없어도 되는건지(dockerfile이 있을 때만 build옵션을 사용하는건지)dockerfile없이 docker-compose를 사용할 수 있는지강의 덕에 쉽게 도커에 입문할 수 있게 되었어요. 감사합니다.
-
미해결파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)
이중for문 과 시간복잡도에 대한 질문
안녕하세요 강사님 강의 잘 듣고있습니다 감사합니다 이전 강의 “ 수들의 합 ” 에서 이중 for 문을 사용하면 시간 복잡도가 O(N²)이 된다고 하셔서이번 문제도 그것을 염두해 이중for문을 사용하지 않으려고 풀어보았습니다. 강의를 보고 질문드립니다 이 문제가 시간복잡도를 따지지않는 문제라서 이중 for문을 사용해도 괜찮은건가요?언제 시간복잡도를 따져야하나요?제가 작성한 코드는 시간복잡도가 어떻게 되나요?
-
미해결따라하며 배우는 리액트 A-Z[19버전 반영]
the moviedb api 키 받기
안녕하세요.api키를 발급 받으려고 하는데 첨부한 이미지의 항목들이 필수 항목인데 이 중 어플리케이션 url은 어떤걸 써야하나요? 제가 강의 내용중에 놓친것인지 몇번을 들어도 해당 내용이 나와서 질문드립니다.ㅠㅠ
-
미해결문제로 배우는 C언어
정수형 배열에서 배열 크기
강사님께서 배열 크기 설정시 \0 때문에 +1 을 된 배열 크기를 설정하라고 하셨었는데 그것은 문자열일 때만 아닌가요? 정수형일 때는 \0 이 안들어간다고 c언어 공식홈에서 확인 하였습니다. 그럼 굳이 난쟁이 문제에서도 크기를 10으로 안하고 9로 해도 괜찮지 않나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
Elasticsearch 에러
수업과 동일하게 세팅하니, 로컬 환경에서는 검색이 작동하는데쿠버네티스로 배포하면 검색이 작동하지 않습니다.에러메세지 : "message": "getaddrinfo ENOTFOUND elasticsearch",배포 시, yaml 파일이나 gcp 환경에서 별도로 세팅해줘야 하는 것이 있는지 질문 드립니다.
-
미해결나도코딩의 자바 기본편 - 풀코스 (20시간)
no usages 이건 어떤 메세지 인가요?
결제해서 이제 시작해볼려고 하는데 no usages 라는 메세지가 많이 보입니다 처음 프로그램 깔며 어떤 설정을 잘못한걸까요?
-
해결됨[무료 MS RPA를 활용한 업무 자동화] Power Automate Desktop Basic
확장설치 문의
안녕하세요6강 듣고 있는데, 잘 안되네요 크롬이나, 엣지를 통해 하는데ui추가하려면 확장프로그램이 필요하다는 창이 뜹니다.그런데 확장 설치는 했는데 계속 이러니 진도를 못나가네요크롬 완전 삭제하고 재설치해보고, 다시 확장설치해도 안되네요 저번 문의때 보내주신 사이트 방법으로 해도 안되고요일단 집에서 다른 노트북으로도 해봐야 겠습니다.혹 다른 방법 있으면 알려주세여뭐든 처음 시도가 쉽지가 않는 것 같습니다.
-
미해결Nuxt.js 시작하기
새로 연습을 하려고 프로젝트를 만들었는데 다음과 같은 화면이 뜹니다.
원인을 모르겠습니다. page에 index.vue와 detail.vue만들어놓은게 다라서..