Webpack crash course | easy way

Подписаться 914 тыс.

Просмотров 56 тыс.

50% 1

Welcome to a youtube channel dedicated to programming and coding related tutorials. We talk about tech, write code, discuss about cloud and devops. That’s what we do all day, all year. We roll out a lot of series and videos on our channel.
All the learning resources such as code files, documentations, articles and community discussions are available on our website:
chaicode.com/
You can find our discord link, github link etc on the above website.
Twitter/X link: x.com/hiteshdotcom
Discord link: hitesh.ai/discord
Learn React with 10 projects: • Let's learn react from...
Learn Docker: • A practical guide on D...
Learn Kubernetes: • Complete Kubernetes Co...
How does a browser works: • How does a browser wor...
How nodejs works: • How node JS works | En...
Learn Redux-toolkit: • Learn Redux Toolkit in...
Learn NextJS: • Nextjs Full stack course
Learn Typescript: • Why to learn Typescript
Learn Javascript: • Welcome to new JavaScr...
Learn React Native: • React Native Mastery: ...
Learn Zustand: • React state management...
Learn Golang: • How to get started wit...

Наука

Опубликовано:

17 апр 2021

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 161

@rutvikshah4589 3 года назад

Most awaited course for REACT developers 😂

@svorwerk 2 года назад

@Hitesh, this is my first time seeing your videos on YT, but I just have to say that I really appreciate your teaching style and the way that you present the important and relevant information. The flow of this video was just so perfect, and I couldn't help but leave a message to say thank you. I rarely ever comment on YT videos, since the comment section is often pretty toxic, but this is a rare exception. Subscribed and enabled notifications! If your other videos are anything even remotely close to this one in terms of information flow and presentation cadence, then I can't wait to check out all your existing content and and I'm very much looking forward to following your channel as you continue to produce great content in the future.

@kovendanragupathi7632 3 года назад

Vow, i have been expecting this crash course from you. Thank you so much

@saalimmushtaq3472 Год назад

This is unbelievable,how can someone make it look so simple,thank you very much,this was much needed

@nerdlekarandy1952 5 месяцев назад

Thanks Hitesh, I went through so many sources to run webpack, this one really explains it plain and simple. You are a good teacher.

@vijaynavale3919 3 года назад

The actual way of teaching is good like it's totally focused teaching on focused topic no design no functionalities I adapted these a long ago 💯👌.

@Dev-Phantom 3 месяца назад

This was my interview question, How to use Webpack and Babel. Finally, its Done a Part of it. Not fully But more than enough. Thanks Hitesh.

@venkatesh6254 3 года назад

Damnn, exactly what I was looking for, just after finishing your MERN course.

@mikewilliams6732 2 года назад

Finally, a Webpack tutorial that explains things simply. Excellent. Thank you Hitesh.

@scottonanski4173 2 года назад

Did you even bother to follow along with it? He fucked it up. This is useless. [webpack-cli] Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema. - configuration.module has an unknown property 'rule'. These properties are valid: object { defaultRules?, exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, generator?, noParse?, parser?, rules?, strictExportPresence?, strictThisContextOnImports?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? } -> Options affecting the normal modules (`NormalModuleFactory`).

@csababalint6506 2 года назад

Best Webpack introduction for beginners I could find. Easy to follow and well explained. Thanks!!

@jawadvajeeh7626 2 года назад

You are just amazing. Your explanation is unique, and you actually teach us how to read and use documentation. And this makes you special and helps us further in our journey to learn and understand further. Thanks, Hitesh!

@sheeraz1022 3 года назад

Hi Hitesh Webpack used to be a nightmare for me, I couldn't find any tutorial as simple as this one. Now I have grasped a bit knowledge about Webpack. Thanks for this wonderful tutorial.

@ashishchoksi8501 3 года назад

wow! whenever I am planning to learn something new and the next day (mostly) Hitesh comes up with a video on that tech. This happens to me 3rd time. 1) docker 2) yaml 3) web pack.

@mahdimousavi3470 2 года назад

Your Videos are awesome, completely perfect and comprehensive and easy to learn. I appreciate it

@barisgunduz 2 года назад

I guess i ll not need any other course about webpack. Thanks for the video man. i appreciate a lot.

@premjitb7541 Год назад

Thank you Sir.....It always felt like a herculean task for me to understand the webpack....but this video is just eminent, it articulates the basics which one will understand easily. A big shout out to you.

@911madza 3 года назад

Do people still use it directly? 👀 I mean in 2021 it feels like it's baked into all those modern frameworks 😀😀

@jaysuthar8749 3 года назад

Now your intro looks super professional

@eleah2665 3 года назад

Yes I can see that look on your face! You will notice from my face that I remember Ajax very well! Thanks for good, quick tutorial.

@bishwajeetpandey1570 Год назад

Thank u so much for giving the test of bundler , i know this a tip of iceberg and there is alot to explore.

@octavian3033 2 года назад

Such an awesome crash course. Thanks a lot

@tarunkumarvella9157 3 года назад

an eyeopener , Thank you hitesh for explaining us on how webpack works , windows users please use babel/core and babel/preset-env and npm install -g win-node-env in order to run and build the project

@akashtakawale9074 3 года назад

Very well explained hitesh !!

@vanshvarshney 3 года назад

Most Awaited Video

@shuvo9131 3 года назад

Thanks for the tutorial. I got my basics. wonderful explanation sir.

@renu3463 3 года назад

Please make a short video on ESbuild and Snowpack

@bhadguy9174 Год назад

You're great. Just saved my dreams.

@md.imanali9998 2 года назад

It's very amazing tutorial! great work.

@NuhAleph 3 года назад

Awesome, we love your content

@alessiaroyce3328 Год назад

Thank you so much for this sir explaining is very clear and easy to understand God bless you 🎉

@arifdevcoding 2 года назад

yeah, i enjoyed and already subscribed

@satishr2071 3 года назад

very nice video and explained very well Thanks keep up the good work ...

@vibhanshubiswas8729 2 года назад

thanks for some clarity I have been pulling my hair all day because some jr. dev chose to work with webpack directly and not being able to work with angular setup. FML. We are close to delivery now.

@aravindks7636 2 года назад

I'm new here, you're teaching way is awesome. Usually, I got bored after 15mins in a tutorial-like video. But your style of speaking is much interesting to watch the video at a single streak

@joeljacob4685 Год назад

Enge pathalum nee😂😂🤣🤣

@prasoon2510 Год назад

It will help on my next round of interview.. Thanks 😊

@akashjalkote248 3 года назад

'NODE_ENV' is not recognized as an internal or external command, operable program or batch file. showing this erroe

@yashkalavadiya5021 3 года назад

(to windows people) In case you are not able to set env like: "build": "NODE_ENV='production' webpack" Install win-node-env globally And set "build": "NODE_ENV=production webpack

@rabindrajoshi9258 3 года назад

install cross env: npm i cross-env use "cross-env NODE_ENV=production" in place of "NODE_ENV=production"

@vishutiwari99 3 года назад

Please make a video on snowpack as well. I heard it is the fastest module bundler.

@sojuthomas7727 3 года назад

Awesome,just plan to learn webpack and it's on the top list of my news feed,did Google crack my mind 😂😂

@chiragkhandelwal9178 3 года назад

Lol there's always a comment like this

@manishvenkatesh5828 3 года назад

@@chiragkhandelwal9178 true 😂😂

@ratnadeepsaha7675 3 года назад

You might have done many google searches on webpack . So using webpack as a tag, google gave u suggestions in yt.. Smart work. Right?

@sojuthomas7727 3 года назад

@@ratnadeepsaha7675 True, I search for webpack on other days. The fun thing is that my plan to search webpack on that day and the same video on the top of my news feed was a coincidence 😂

@ratnadeepsaha7675 3 года назад

@@sojuthomas7727 google knows almost everything.. Be careful if you are married 😂😂

@ahmadpak 2 года назад

Thank you so much Hitesh

@HaileabAbrha 3 года назад

Thanks for your wonderful lecture

@kumarashish2607 2 года назад

cool! really great content.

@RazerCrick 3 года назад

Very nice, gave a lot of insights of the underlying things for CRA. I am having one query: How can we make build release process of a component inside a large app independent. I have a react app name: example inside that i have component-a component-b component-c How can i make independent deployment for component-c without deploying the whole app (i.e example here) ? thoughts i tried: - component-c i can put on npm but that again required update of package in main app once i release a new version of component-c. resulting in a new deployment of the whole app. - Hosting on something like bit dev

@pixelsbyme 3 года назад

I just purchased a course from LCO sir. Your courses are cool. But just one thing, I like your dev setup (especially theme and font in VS Code) . Could we get a video on that? Thanks again for such amazing courses

@tanzeelahmed2055 3 года назад

I was eager to watch this video....

@manojdewangan7534 3 года назад

First Day : First Show 😍

@learnearn8721 3 года назад

Saturday interviewer asked me do you know webpack I said no that time. But now I got the answer thank u so much Hitesh sir..

@amantech683 3 года назад

Now this is a legendary content from a legendary creater..... Salut to you hitesh sir.... Love from a 15 year old fan❤️❤️❤️❤️❤️

@devanshsinghparmar 3 года назад

Lier, Your Id on RU-vid From 2018 Biggest Lie!

@amantech683 3 года назад

@@devanshsinghparmar what do u mean dear

@devanshsinghparmar 3 года назад

@@amantech683 I mean you said in last "Love from 15 years" and your id is created from 2018...

@amantech683 3 года назад

@@devanshsinghparmar ohh dude thats a misconception brother i meant that i am 15 years old 😀😀

@devanshsinghparmar 3 года назад

@@amantech683 Oh Sorry for that just a mistake, Sorry bro

@manojbhamre6062 3 года назад

love ur content

@amankhanna354 2 года назад

Thanks dude🔥

@moeedelahi3001 2 года назад

hey, this is my first time that i am on this channel and the way u explained webpack ,wo man i mean i'm not gonna forget it surely, but i have a question on what scenario do we need to work with webpack manualy i m a react develper and as i have seen it when i run the command npm create react app it automatically install's webpack? so when will we need this?

@sudo-abhinav 3 года назад

thanku sir for awesome courses ❤️🙏

@HiteshChoudharydotcom 3 года назад

Most welcome

@sanilkp6180 2 года назад

This excellent tutorial really helped me! Very easy to follow. Thank you very much for the same! Appreciate your effort!

@HiteshChoudharydotcom 2 года назад

Thanks

@sakshamjaiswal4025 2 года назад

Great One

@chamansoni8013 3 года назад

Ya really tough for beginners thanks for this video

@HiteshChoudharydotcom 3 года назад

Not anymore 😀

@javascriptguy6282 3 года назад

Purchased React from LCO i like your teaching technique

@HiteshChoudharydotcom 3 года назад

Thanks and welcome

@muhammad_haseeb_ali 2 года назад

thank you sir for this

@hiteshsuthar1097 2 года назад

Thanks

@hamzabadar202 2 года назад

Sir I am getting an error using command npm run build exit(`Invalid env var:`, arg); ReferenceError: exit is not defined

@iamdevvalecha 3 года назад

captivating!

@jaganraajan 3 года назад

Clear explanation

@sandeepkumarmishra7267 3 года назад

thanks for this video...

@pawan29121991 3 года назад

I am really interested to teach the technology like you . Can you help where can I get started ? Also if possible, share all the logistics you use to get output like your videos are.

@rohitkumar-ub3km 2 года назад

Thanks Brother

@YouAndImpact 3 года назад

Nice video 👍

@bhumit070 3 года назад

Sir i talked about indexed db on instagram remembered ? Would love to see video on it

@rajkumarpatel9735 2 года назад

Now with npm start works with "webpack-dev-server"

@abdulmalikzihad3542 3 года назад

If I need to use web pack for my another project. Do I need to go again and again with this steps or there is another way to do it

@ratnadeepsaha7675 3 года назад

Bro.. Please make a video on Vanilla JS

@subharupchakraborty522 2 года назад

I found similarity between the way you speak and the way Mosh speaks

@arpithiside 3 года назад

Sir you're getting fitter day by day🔥

@HiteshChoudharydotcom 3 года назад

Thanks but gyms are now closed my city. Hope you are doing good too

@VenkatGudavalli 3 года назад

Six pack...coming soon 😁

@lemokami 3 года назад

@@VenkatGudavalli webpack with sixpack😌

@VenkatGudavalli 3 года назад

@@lemokami 🤣🤣

@Akira-sh7ts 2 года назад

Thanks sir now plz make video on babble js

@animeshsingh4290 3 года назад

Wouldn't running npx run --watch be the same thing as running a dev server ?

@technotok 3 года назад

R gjb 🤓

@yash.dobariya 2 года назад

good one

@Dev-Phantom 3 месяца назад

cool

@vashishtdevasani9028 3 года назад

Difference between grunt and webpack?

@darkseid3427 3 года назад

Sir do you have course on web developement for beginners?

@mansoorbepar 3 года назад

Need VScode theme settings 🙏

@VipinMS77 3 года назад

Damn informative

@hemanthchepuri3049 3 года назад

Your courses are so cool sir

@HiteshChoudharydotcom 3 года назад

Glad you like them!

@hemanthchepuri3049 3 года назад

@@HiteshChoudharydotcom Everyone complaints about you teaching in English, but we guys from Andhra Pradesh and Tamil Nadu don't know the Hindi language......So keep teaching in English (Common language) only sir😊😊😊😊.

@sanidhyaojha5676 3 года назад

Sir is m1 mac good for coding in vscode i.e. it supports vs code or not?

@lemokami 3 года назад

ya it is. I am currently using one

@namratadas5569 Год назад

Great video Hitesh! While doing npm run build i'm getting below error NODE_ENV' is not recognized as an internal or external command, operable program or batch file. could u plz suggest on this?

@rikgissel9189 Год назад

***THIS IS A COPIED AND PASTED COMMENT. ALL CREDIT GOES TO abclpiano. For Windows people, to resolve the error, “Node_ENV=production webpack “ is not an internal/external command. Then follow the steps.🪜 given below 👇 : (1) Execute the following command 🖥 npm install -g win-node-env (2) Go to the package.json file, and add “&” as follows: ⚙ “scripts”: { “build”: “NODE_ENV=‘production’ & webpack”, } (3) Now, Go to the terminal 🖥 and run again npm run build It will work ✅✌✌🤗✅

@anuragtawaniya7746 3 года назад

Sir make a crash course on bootstrap 5

@rajantandan9723 3 года назад

Cool intro

@sabazalam1987 3 года назад

Pls pls pls sir make video on your vs code theme.. 😔

@rahulpradhan4862 11 месяцев назад

if you found any error in npm run build trt this "scripts": { "start": "webpack serve", "build": "webpack", "test": "echo \"Error: no test specified\" && exit 1" },

@Allrounder-wf5mv 10 месяцев назад

Nice explanation

@HiteshChoudharydotcom 10 месяцев назад

Thanks and welcome

@mohammedaabid5180 3 года назад

Hitesh na make video on svelte

@harshitakumawat3917 9 месяцев назад

hello sir!! sir i have setup webpack but why i;m getting so much eslint errors in my production build files. like Unexpected combined character in character class.eslint , Do not access Object.prototype method 'hasOwnProperty' from target object.eslintno , Do not access Object.prototype method 'hasOwnProperty' from target object.eslintno-prototype-builtins AND so many errors epprox 200 . Please help me to resolve this issue.

@varaprasadhalajangi8200 3 года назад

it will be helpful, FYI to load up js files regex doesnt have to be grouped /\.(js)$/ /\.js$/ works fine, if you want to load jsx as well then /\.(js | jsx)$/ or /\.js(x?)$/

@jeevanstha57 2 года назад

How to add jquery in webpack?

@thisissharief7651 2 года назад

pls specify the os you are using it is creating problems \

@leeeric6292 6 месяцев назад

Even I have installed the "npm install -g win-node-env", after I type in "npm run build", error messages are shown in the terminal, that is './src', I don't got it. And the "dist" folder is not produced accordingly. I tried to change the name of "app" folder to "src" folder, then I can see the "dist" folder is produced, however, the filename of the file produced is called "main.js", not "bundles.js," and there is no html file produced....

@ashishchoksi8501 3 года назад

Hello Hitesh sir, I am struggling to learn CI/CD pipeline. I have to make my GitLab such that when I push my changes to a particular branch it will automatically run the test file and deploy code to the server. so, I got to know about CI/CD is something that can do this, search on youtube but not understood well. Is that possible for you to make a video on that? or if someone knows or has a good resource, please share.