수강이 제한됩니다.
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결쉽게 배우는 Webpack
package.json 질문있습니다!
webpack을 설치하실때 앞선 예제에서는 dependencies로 설치하셨는데, 현재 예제에서는 devDependencies로 설치하셔서 좀 헷갈립니다. 앞 강의에서 앱로직과 관련이 있으니 dependencies설치하는거라고 봤는데 어떤게 맞는건가요? 혹시 지금 질문드린 개념이 크게 중요한 부분은 아닌건가요?
- 해결됨쉽게 배우는 Webpack
질문이 있습니다.
Gulp와 Webpack 둘다 웹 자동화 도구로 알고 있는데 2개의 자동화 도구를 섞어서 쓰는 이유가 궁금합니다.
- 미해결쉽게 배우는 Webpack
안녕하세요
안녕하세요 즐겁게 수강하고 있는 수강생입니다.! 웹팩 초반에 알려주신 깃헙 저장소에 있는 파일과 강좌의 파일이 달라서 이렇게 여쭤봅니다..
- 미해결쉽게 배우는 Webpack
web pack 에러
Insufficient number of arguments or no entry found. Alternatively, run 'webpack(-cli) --help' for usage info. Hash: d6c939b5a5a99e62ccf4 Version: webpack 4.41.6 Time: 28ms Built at: 02/29/2020 10:56:21 PM WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' optio n to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configur ation/mode/ ERROR in Entry module not found: Error: Can't resolve './src' in '/Users/yun-ali/Downloads/LearnWebpack-ma ster'
- 미해결쉽게 배우는 Webpack
webpack app/index.js dist/bundle.js 에러
Hash: b211197d852a06714d7a Version: webpack 4.41.5 Time: 45ms Built at: 02/29/2020 9:52:44 PM 1 asset Entrypoint main = main.js [0] multi app/index.js dist/bundle.js 40 bytes {0} [built] WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'pro duction' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/ ERROR in multi app/index.js dist/bundle.js Module not found: Error: Can't resolve 'app/index.js' in '/Users/yun-ali/Desktop/LearnWebpack-master' @ multi app/index.js dist/bundle.js main[0] ERROR in multi app/index.js dist/bundle.js Module not found: Error: Can't resolve 'dist/bundle.js' in '/Users/yun-ali/Desktop/LearnWebpack-master' @ multi app/index.js dist/bundle.js main[1]
- 미해결쉽게 배우는 Webpack
page reload
webpack-dev-middleware 사용시 자동 컴파일이 되기는 하는데 index.js 소스를 변경시 화면이 실시간으로 변경되지 않습니다. 새로고침해야 바뀌는데요. 찾아보니 webpack-hot-middleware를 추가적으로 설정해야된다고 나와서 아래 사이트를 참고해서 테스트를 해보았습니다. webpack-hot-middleware live reload 위의 live reload링크 예제 소스를 받아서 최신버전에 맞게 수정하고 돌려보니 css소스는 실시간 변경되서 적용되는데 js파일은 수정하고 저장하면 바뀌지 않고 있네요..ㅠㅠ
- 미해결쉽게 배우는 Webpack
npm i ejs
webpack, express, webpack-dev-middleware를 install하라고 되어 있는데 ejs가 빠졌습니다. npm i ejs 명령어 추가해주세요. ejs없을시 Error: Cannot find module 'ejs' 발생합니다. 혹시 모르시는 분 있을까바 작성하였습니다.
- 해결됨쉽게 배우는 Webpack
webpack 4버전에서 CommonsChunkPlugin대신..
4버전부터는 CommonsChunkPlugin을 지원하지 않습니다. 아래 링크를 참고하세요~ https://negabaro.github.io/archive/webpack-splitChunks
- 해결됨쉽게 배우는 Webpack
getting-started 예제 오류
getting-started 예제 작성시 1. webpack 전역설치 npm i webpack webpack-cli -g 2. package.json 생성 npm init -y 3. 번들링 webpack app/index.js dist/bundle.js 여기서 다음 오류가 발생합니다. ERROR in Entry module not found: Error: Can't resolve './src' in 'D:\study\03.inflearn\LearnWebpack-master\getting-started' 폴더명이 app이라서 안되는 것 같아 src로 바꾸고 바로 webpack 명령어만 치니까 dist폴더가 생성되고 main.js파일이 생겼습니다. 강의에서는 src폴더가 아닌 app폴더를 만들고 dist폴더에 원하는 파일명으로 만들어지는 것 같은데요. webpack버전의 문제인지요? webpack 버전은 4.41.6입니다. *webpack.config.js파일 만들기 전에 생긴 오류입니다. webpack.config.js파일 만들어서 내가 원하는 경로랑 파일이름 설정 후 npm run build를 하니 되긴 하네요. webpack.config.js파일을 만들지 않고 webpack명령어로 생성하려면 어떻게 하면 될까요?
- 미해결쉽게 배우는 Webpack
npm I web pack-cli -g 오류
un-aliui-MacBook-Pro:LearnWebpack-master yun-ali$ webpack Insufficient number of arguments or no entry found. Alternatively, run 'webpack(-cli) --help' for usage info. Hash: d6c939b5a5a99e62ccf4 Version: webpack 4.41.5 Time: 29ms Built at: 02/07/2020 10:36:58 PM WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' optio n to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configur ation/mode/ ERROR in Entry module not found: Error: Can't resolve './src' in '/Users/yun-ali/Downloads/LearnWebpack-ma ster'
- 미해결쉽게 배우는 Webpack
$ webpack app/index.js dist/bundle.js
$ webpack app/index.js dist/bundle.js하면 Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration.output.path: The provided value "" is not an absolute path! -> The output directory as **absolute path** (required). 경로 에러가 나는데 /d/github/LearnWebpack/getting-started/app 안됩니다..
- 미해결쉽게 배우는 Webpack
webpack app/index.js dist/bundle.js 시 오류가 뜹니다.
webpack app/index.js dist/bundle.js 시 오류가뜹니다. 계속 다시 해봐도 같은 증상이네요..4- Built at: 2020-02-03 13:46:48 1 asset Entrypoint main = main.js [1] multi ./app/index.js dist/bundle.js 40 bytes {0} [built] [2] ./app/index.js 286 bytes {0} [built] [3] (webpack)/buildin/global.js 472 bytes {0} [built] [4] (webpack)/buildin/module.js 497 bytes {0} [built] + 1 hidden module WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/ ERROR in multi ./app/index.js dist/bundle.js Module not found: Error: Can't resolve 'dist/bundle.js' in 'C:\Users\tmdgn\Desktop\BOBA\webpack\LearnWebpack-master\LearnWebpack-master\getting-started' @ multi ./app/index.js dist/bundle.js main[1]
- 해결됨쉽게 배우는 Webpack
cmder 로 실행해도 에러가 동일합니다.
cmdere에서 webpack 설치시 에러가 동일합니다.
- 해결됨쉽게 배우는 Webpack
webpack visual studio code애서 설치시 에러
Vue.js 시작하기 - Age of Vue.js 강의 들은 후 이 강의 듣고 있습니다. 설설치가 안됩니다.
- 미해결쉽게 배우는 Webpack
마지막 강의 참고 자료 문서
안녕하세요 질문이 하나 있어서 남기게 되었습니다. 마지막 강의 웹팩 참고자료 파일은 혹시 어디서 확인 할수 있는지 궁금해서요 강의 잘 들었습니다. 감사합니다.
- 미해결쉽게 배우는 Webpack
웹팩강의 리뉴얼
일전에 담당자와 이메일을 주고 받았을때 조만간 웹팩강의 리뉴얼이 된다고 들었습니다. 작년 12.13 기준 한달 이내라고 안내를 받았습니다. 기다리고 있는데 , 혹시 정확한 날짜가 있을까요?
- 미해결쉽게 배우는 Webpack
npm install webpack & jquery --save-dev 시에 jquery not found error
npm install webpack & jquery --save-dev 를 쳤을때 $ npm install webpack & jquery --save-dev [1] 17152 bash: jquery: command not found 이라는 문구와 함께 webpack.config.js 에는 "dependencies": { "webpack": "^4.41.5" }, "devDependencies": {} 이렇게 되는데 웬만하면 막히는 부분은 혼자 찾아서 해볼려고하지만 이부분은 찾지를 못하겠어서 질문 남깁니다.. ㅠㅠ 일단은 webpack을 --save-dev로 jqeury는 --save로 설치해놓은 상태입니다.
- 미해결쉽게 배우는 Webpack
webpack 설치 및 powershell 오류
안녕하세요. 캡틴 판교님. webpack을 설치하고 webpack을 실행하는 데 있어 아래와 같이 powershell에서 실행이 되지 않아 질문 올립니다. 해결책이 무엇이 있을까요...ㅠ
- 미해결쉽게 배우는 Webpack
manifest을 넣고 돌리면 에러가 나와요.
아래와 같이 manifest 넣고 webpack 을 돌리면 에러납니다. throw new RemovedPluginError(errorMessage); ^ Error: webpack.optimize.CommonsChunkPlugin has been removed, please use config.optimization.splitChunks instead. at Object.get [as CommonsChunkPlugin] (C:\work\saramin\LearnWebpack\example2\node_modules\webpack\lib\webpack.js:189:10) at Object.<anonymous> (C:\work\saramin\LearnWebpack\example2\webpack.config.js:18:30) at Module._compile (C:\work\saramin\LearnWebpack\example2\node_modules\v8-compile-cache\v8-compile-cache.js:192:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10) at Module.load (internal/modules/cjs/loader.js:653:32) at tryModuleLoad (internal/modules/cjs/loader.js:593:12) at Function.Module._load (internal/modules/cjs/loader.js:585:3) at Module.require (internal/modules/cjs/loader.js:690:17) at require (C:\work\saramin\LearnWebpack\example2\node_modules\v8-compile-cache\v8-compile-cache.js:161:20) at requireConfig (C:\Users\user\AppData\Roaming\npm\node_modules\webpack\bin\convert-argv.js:96:18) at C:\Users\user\AppData\Roaming\npm\node_modules\webpack\bin\convert-argv.js:109:17 at Array.forEach (<anonymous>) at module.exports (C:\Users\user\AppData\Roaming\npm\node_modules\webpack\bin\convert-argv.js:107:15) at Object.<anonymous> (C:\Users\user\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js:153:40) at Module._compile (internal/modules/cjs/loader.js:776:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10) at Module.load (internal/modules/cjs/loader.js:653:32) at tryModuleLoad (internal/modules/cjs/loader.js:593:12) at Function.Module._load (internal/modules/cjs/loader.js:585:3) at Function.Module.runMain (internal/modules/cjs/loader.js:829:12) at startup (internal/bootstrap/node.js:283:19) at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3) 이런 에러 메세지 나옵니다. webpack4 버전이라 그런것 같은데 혹시해결 방법이 있을까요?
- 미해결쉽게 배우는 Webpack
CommonsChunkPlugin 을 사용 했을떄 용량 준다고설명 하셧는데요.
plugins: [ new webpack.optimize.CommonsChunkPlugin({ //공통적으로 사용 하는 모듈(라이브러리) name: 'vendor' // Specify the common bundle's name. }), ] 해당 코드를 넣고 webpack 돌려도 용량은 동일 하게 나오는데요 혹시 webpack 4 버전에서는 차이가 없나요? 그리고 webpack 돌리면 min.js 처럼 공백없이 다 합처지는게 이거 영상 처럼 공백 포함 되서 나오게 할수 있는 방법이 있나요?