강의

멘토링

로드맵

인프런 커뮤니티 질문&답변

하나라도더님의 프로필 이미지
하나라도더

작성한 질문수

웹 게임을 만들며 배우는 Vue

3-4. v-for로 반복문 사용하기

npm run build 시 강사님같은 app.js가 생성되지 않음

작성

·

17

0

image.pngimage.pngimage.png

npm run build 실행시 위와 같은 메시지만 뜨고 하단의 app.js 화면같이 뜹니다.

다른분의 응답처럼

image.png

이거 경로도 바꿔봤고요. 실행하면 개발자 도구에서

image.png

요렇게 되는데요? html 출력과 app.js가 강사님과 다른이유 문의드립니다.

그리고 다른분응답에 github에서 소스 비교해보라고 남기신 글도 있던데 주소도 궁금합니다. 감사합니다.

 

답변 2

0

오우 해결했습니다.

0

안녕하세요, 인프런 AI 인턴입니다. 하나라도더님.

Webpack과 npm을 사용하시면서 빌드된 app.js 파일이 의도한 대로 생성되지 않는 문제에 대해 고민하고 계시네요. 이와 유사한 문제를 겪은 다른 사용자들이 있었고, 몇 가지 해결 방안을 찾을 수 있었습니다.

  1. 경로 문제: webpack 설정에서 output 경로가 제대로 설정되어 있는지 확인해보세요. 특히 outputpath가 프로젝트의 경로에 맞게 설정되어 있는지 확인하는 것이 중요합니다. 예를 들어, path: path.resolve(__dirname, 'dist')로 설정되어 있는지 확인해보세요.

  2. Webpack 버전 문제: 웹팩의 버전이 다르면 설정 파일의 형식이 달라질 수 있습니다. 제로초 강사님의 강의는 특정 웹팩 버전을 기준으로 하고 있으니, 같은 버전을 사용하고 있는지 확인해보시는 것도 방법입니다.

  3. Github 소스 코드와 비교: 강사님의 최신 소스 코드와 버전을 비교하면서 다른 점을 찾는 것이 좋습니다. 강사님께서 제공하시는 GitHub 링크는 웹 게임을 만들며 배우는 Vue 강의에 대한 제로초님의 GitHub 리포지토리입니다.

  4. 빌드 메시지 및 에러 확인: 터미널에 나타나는 빌드 메시지와 에러 로그를 자세히 살펴보세요. 추가적인 오류 메시지가 있습니까? consol.log를 사용하여 빌드 단계마다 출력되는 값을 확인해보는 것도 도움이 될 수 있습니다.

  5. 실행 환경: 브라우저에서 직접 HTML 파일을 여는 대신, webpack dev server를 통해서 실행하고 있는지 확인하세요. npm run dev 명령어를 사용해서 확인할 수 있으며, 이 경우 서버 환경에서 스크립트를 탐색하게 됩니다.

추가적으로, 직접 GitHub에서 코드와 설정을 비교하고, 강좌 공지를 통해 버전 또는 설정 관련 업데이트 사항을 확인하는 것도 문제 해결에 큰 도움이 될 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

하나라도더님의 프로필 이미지
하나라도더

작성한 질문수

질문하기