프론트엔드 개발자를 위한 웹팩
프론트엔드 개발자를 위한 웹팩
수강정보
(45개의 수강평)
645명의 수강생
스킬태그 #Front-End, #Webpack
33,000원
지식공유자 : 장기효(캡틴판교)
64회 수업 · 총 3시간 27분 수업
기간 : 평생 무제한 시청
수료증 : 발급 강의
수강 난이도 : 초급
wkdejrtlr 프로필

src/index.js 파일을 수정하면. wkdejrtlr 1달 전
안녕하세요, 강의 열심히 듣고있습니다. 만약에 index.js파일을 수정하면 터미널에서 항상 npm run build를 계속 써줘야하는건가요? 한줄 수정하고 브라우저에서 새로고침하니까 안바뀌는데 실무에서는 보통 어떻게 진행되는지 궁금합니다. 그리고 웹팩 핸디북에 몇몇 페이지가 빈 페이지로 나오는데 맞는건지 확인도 부탁드립니다. https://joshua1988.github.io/webpack-guide/advanced/tree-shaking.html https://joshua1988.github.io/webpack-guide/from-scratch.html https://joshua1988.github.io/webpack-guide/tutorials/plugins.html 강의와 관련있는 질문을 남겨주세요.• 강의와 관련이 없는 질문은 지식공유자가 답변하지 않을 수 있습니다. (사적 상담, 컨설팅, 과제 풀이 등)• 질문을 남기기 전, 비슷한 내용을 질문한 수강생이 있는지 먼저 검색을 해주세요. (중복 질문을 자제해주세요.)• 서비스 운영 관련 질문은 인프런 우측 하단 ‘문의하기’를 이용해주세요. (영상 재생 문제, 사이트 버그, 강의 환불 등) 질문 전달에도 요령이 필요합니다.• 지식공유자가 질문을 좀 더 쉽게 확인할 수 있게 도와주세요.• 강의실 페이지(/lecture) 에서 '질문하기'를 이용해주시면 질문과 연관된 수업 영상 제목이 함께 등록됩니다.• 강의 대시보드에서 질문을 남길 경우, 관련 섹션 및 수업 제목을 기재해주세요. • 수업 특정 구간에 대한 질문은 꼭 영상 타임코드를 남겨주세요! 구체적인 질문일수록 명확한 답을 받을 수 있어요.• 질문 제목은 핵심 키워드를 포함해 간결하게 적어주세요.• 질문 내용은 자세하게 적어주시되, 지식공유자가 답변할 수 있도록 구체적으로 남겨주세요.• 정확한 질문 내용과 함께 코드를 적어주시거나, 캡쳐 이미지를 첨부하면 더욱 좋습니다. 기본적인 예의를 지켜주세요.• 정중한 의견 및 문의 제시, 감사 인사 등의 커뮤니케이션은 더 나은 강의를 위한 기틀이 됩니다. • 질문이 있을 때에는 강의를 만든 지식공유자에 대한 기본적인 예의를 꼭 지켜주세요. • 반말, 욕설, 과격한 표현 등 지식공유자를 불쾌하게 할 수 있는 내용은 스팸 처리 등 제재를 가할 수 있습니다. 

1
sion007005 프로필

extensions에서 *은 무엇을 의미하나요?? sion007005 1달 전
'*'은 어떤 확장자를 의미하는 것인지, 꼭 써줘야 하는건지 궁금합니다!ㅎㅎ 

1
sion007005 프로필

이런 에러?창이 vs code에서 뜹니다! sion007005 1달 전
안녕하세요 캡틴판교님ㅎ_ㅎ  강의 따라가면서, package.json파일 scripts 부분에  "dev":  "webpack-dev-server" 입력 후 저장을 하니까  아래 빨간 박스와 같은 내용이 떴는데요!  어떤 버전을 확인하라는 건지 모르겠어서 우선 그냥 overwrite를 누르고 진행했는데 끝부분까지 문제 없이 따라갈 수 있었습니다!  혹시 나중에 제가 혼자 할 때 이런 내용이 뜬다면 그냥 overwrite를 해주면 되는 지,  아니면 확인하고 넘어가야 할 부분이 있는 내용인건지.. 알려주시면 감사하겠습니다!!!  (뭔가 Debug라 써있으니까 굉장히 신경이 쓰여요ㅠ__ㅠ)

1
sion007005 프로필

질문이 있습니다~~! sion007005 1달 전
안녕하세요 캡틴님 ㅎ_ㅎ   main.bundle.js 파일이 아래와 같이 나타나서  배웠던 내용을 기억해서 webpack.config.js 파일을 살펴보니  mode가 production으로 되어있더라구요!  그래서 none으로 수정 후 저장했는데 main.bundle.js는 그대로입니다 ㅠㅠ 혹시 webpack.config.js에서 어떤 내용을 수정한 후에는 npm run build 명령어를 다시 쳐주어야 할까요?? 

1
sion007005 프로필

지역설치 폴더 질문드립니다! sion007005 2달 전
안녕하세요 캡틴판교님!!! ㅎ_ㅎ 다른거 하느라 뷰강의를 계속 못듣다가, 어제 오늘 초급중급 다시 복습하고 웹팩 강의를 재밌게 듣고있습니다!!!  아주 사소한 건데 전부터 궁금했던 점이 있어서 질문을 남겨요...!  1. 지역 설치 명령어를 입력할 때 예를들어 강의 내용을 기준으로 하면, 터미널에서 현재 위치가 LEARNWEBPACK이라면 cd npm 으로 프로젝트 폴더까지 위치시킨 후에 npm install jquery 이런식으로 명령어를 입력해야 하나요? 아니면 혹시 프로젝트 폴더가 아닌 그 폴더를 포함하고 있는 폴더인 LEARNWEBPACK 위치에서 지역 설치 명령어를 입력해도 문제가 없을까요?  2.비슷한 질문인데, 그럼 반대로 전역 설치를 한다면 폴더 위치에 상관없이 그냥 명령어를 입력해주면 될까요?? 3.만약 전역으로 vue를 제 컴퓨터에 설치해놓은 상황이라면 vue로 프로젝트를 진행할때마다 그 폴더에 vue를 설치하지 않아도 되는건가요?? 늘 좋은 강의 감사드립니다!!! :) 

1
2lian 프로필

빌드시 환경변수로 import 제외하고 싶은데요. 2lian 2달 전
이 문제때문에 고민하다가, 수강을 진행하게 된 사람입니다. mobile또는 pc 별로 빌드를 진행해야해서 , scss 에서 import해올때 경로 또는 파일이름 별로 import를 제외 시키고 싶은데, 이부분이 잘 안되서 문의드립니다.   { test: /\.scss$/, exclude: path.resolve(__dirname, "./../src/tokens/mobile/"), use: [ MiniCssPlugin.loader, 'css-loader', 'sass-loader' ] 이 방법도 안되고, 아래처럼 plugin을 사용해서 webpack.IgnorePlugin을 해도 여전히 mobile쪽이 적용되는것 같습니다. plugins: [ browserSyncPlugin, new MiniCssPlugin({ filename: 'css/[name].css', chunkFilename: 'css/[id].css' }), new webpack.IgnorePlugin({ resourceRegExp: /\.scss$/, contextRegExp: /mobile/ })] webpack은 뭐 디버깅을 해보기가 너무 어렵네요.. 에러도 안나고 그냥 조용히 계속 값을 들고오는데, 어떻게 접근하면 좋을까요..

1
Kys M60 프로필

gulp 명령어가 안먹힙니다. Kys M60 3달 전
global로 깔았는데 gulp가 안먹힙니당..

3
Sang-ok Lee 프로필

즉시실행함수에 대해 질문합니다. Sang-ok Lee 3달 전
(function(){ })() () 이렇게 함수 실행 까지 붙어야 즉시 실행아닌가요?

1
영찬김 프로필

1:08 쯤에 info hint 는 무었인가요? 영찬김 3달 전
궁금해서 https://webpack.js.org/configuration/dev-server/여기서 찾아봤는데 hint 로 검색하니까 안나와서여,,

1
울룰룰랄랑 프로필

sourcemap 관련하여 궁금한 점이 있어 질문드립니다! 울룰룰랄랑 4달 전
안녕하세요 캡틴판교님!! 제가 또 무엇을 잘못하였는지.. 부득이하게 질문을 드리게 되었는데욤 ㅠㅠㅋㅋ ES6 Modules 빌드 결과물 분석 - sourcemap 강의 내용중에 개발자도구를 통해 Sources 탭에 index.html 파일을 보는 내용이 있는데욤. 강의에선 소스가 app.js로 보이는데 저는 index.html, main.bundle.js 두개의 파일로 보이더라구욤.. (이미지 파일은 좀 깨져서 잘 안보이실 거예욤! ㅠㅠ) 그래서 webpack.config.js 파일이 잘못되었는지 확인해봤는데 제눈이 이상한건지 무엇이 잘못되었는지 보이지가 않네요 ㅠㅠ ㅜㅜ 이유를 잘 모르겠네요... 제가 뭔가 빠뜨린 것 같긴한데 말이죠.. 아무튼 감사합니다 강사님!!  추가로 여담이지만 프론트엔드 웹 강의는 강사님 강의가 정말 좋은듯해요.. 현업에 Vue.js, 웹팩 등 정말 도움이 많이 되고있습니다.. 완강하게 되면 수강평을 좀 더 자세히 써서 올리도록 하겠습니다^^ 즐거운 하루 되세욤!

2
ham 프로필

Webpack devServer 실행시 requests 에 대해 질문드립니다. 그리고 링크 오류 질문드립니다!🙋‍♂ ham 4달 전
캡틴판교님 안녕하세요?! 강의 잘 보고 있습니다. 😎 다름이 아니라 Webpack devServer 실행시 requests 개수가 강좌에서 실행된 것과 달라 질문드립니다.🙋 그대로 따라한 것 같은데😱 아래 이미지처럼 차이가 생기는 바람에 곤혹스럽습니다..😹😹 강좌를 통해 HTTP 요청 숫자를 줄이는 것의 중요성에 대해선 이해를 했지만.. 요청숫자가 안 줄여집니다..😿😿 제가 어떤 부분을 놓치고 있는지 잘 모르겠습니다. 😵 ## 그리고 링크 오류 질문드립니다. 바벨과 ES6 모듈 문법 - 의 3번째 강좌 [ES6 Modules  실습] 강의노트에 있는 링크가 아래와 같은데 404 Not Found가 발생합니다. https://github.com/joshua1988/LearnWebpack/es6-modules 3번째 강좌 [ES6 Modules  실습]을 진행하려면 아래 링크(⬇️)를 통해 진행해야 하는 게 맞는 걸까요? https://github.com/joshua1988/LearnWebpack/tree/master/es6-modules

3
desk53 프로필

웹팩 맛보기 예제 6번 desk53 4달 전
동영상 대로 했는데 ERROR in Entry module not found: Error: Can't resolve './src' in 'C:\Users\user\project\webpack' 뜹니다. 빠뜨린것도 다 체크했는데 계속 이 구문이 뜨면서 빌드가 안되고 에러가 뜹니다.

5
jfmam 프로필

_에대해서 jfmam 4달 전
import _ 이것과 _.join은 무엇을 의미하는건가요? js용어인가요?

1
ham 프로필

웹팩 시작하기 부분의 파트2와 파트3이 중복됩니다. 😭😭 ham 4달 전
아래의 두 강의 모두 튜토리얼 파트 2가 나옵니다. ㅠㅠ..!😭 - 웹팩 시작하기 튜토리얼 파트 2 - 웹팩 적용 후 - 웹팩 시작하기 튜토리얼 파트 3 - mode 적용 '웹팩 시작하기 튜토리얼 파트 3 - mode 적용' 강의 수정을 부탁드립니다..ㅠ! 😭🙏🙏 교안으로 작성해주신 자료가 워낙 꼼꼼하여 수업을 듣는데 지장은 1도 없지만 그래도 영상을 통해 어떤 내용을 설명해주고 계시는지 궁금합니다..!🙏

1
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스