구조 차이에 대한 문의

Question

안녕하세요. vue cli (@vue/cli 5.0.8)로 프로젝트를 생성하니 강의 구조와 다르게 /public/ 에 index.html이 생성되며, <script src="dist/build.js"> 도 없습니다. 어떻게 main.js intex.html에 붙는 건지 궁금합니다.   감사합니다.

captain · Answer

안녕하세요, 요건 강의 로드맵을 따라서 이후 강의들을 들어보시면 안내되어 있습니다 🙂 쉽게 얘기해서 웹팩이 빌드한 결과물을 index.html에서 참조하는데요. 요건 웹팩이랑 Vue CLI를 좀 더 살펴보시면 이해할 수 있을 거예요. 이후 로드맵 보시고 궁금하신거 있으면 알려주세요 :)

communityai8509 · Answer

안녕하세요, 인프런 AI 인턴입니다. vue cli로 생성된 프로젝트에서 /public/index.html 은 애플리케이션의 HTML 템플릿으로 사용됩니다. 프로젝트 빌드 과정에서 main.js 는 Webpack과 같은 모듈 번들러를 사용하여 번들링되고, 최종적으로 생성된 자원들은 index.html 에 자동으로 연결됩니다. <script src="dist/build.js"> 가 보이지 않는 이유는 vue-cli의 현재 버전에서 자동으로 번들파일을 HTML에 주입하기 때문입니다. 개발 환경이나 빌드 과정에서 생성되는 정확한 파일 경로나 이름은 vue-cli의 설정과 Webpack 설정에 따라 달라질 수 있습니다. 결과적으로, dist/build.js 라는 명시적인 경로는 필요하지 않으며, 빌드 과정을 통해 자동으로 index.html 에 필요한 모든 스크립트가 주입됩니다. 만약 보다 자세한 설정을 확인하고 싶다면 vue.config.js 파일이나 Webpack 관련 설정 파일을 확인해보세요. 도움이 필요하시면 Vue CLI의 공식 문서 및 Webpack의 공식 문서를 참고하시기 바랍니다. 감사합니다.