Check out a free preview of the full Webpack 4 Fundamentals course

The "Adding Watch Mode" Lesson is part of the full, Webpack 4 Fundamentals course featured in this preview video. Here's what you'd learn in this lesson:

Sean demonstrates how to watch mode, which instructs Webpack to incremental compile as changes are made to the code.

Preview
Close

Transcript from the "Adding Watch Mode" Lesson

[00:00:00]
>> Sean Larkin: I don't want to have to force anybody to have to run mpm run prod a thousand times and so, why don't we jump back into our scripts. We can solve this. Webpack has a watching mode and so, maybe it makes sense for our development mode, that we just have a watch flag added on.

[00:00:20]
What's cool is that guess what, we just have to compose the watch flag onto the end of our DevScript.
>> Speaker 2: Does the order matter there?
>> Sean Larkin: It does not.
>> Sean Larkin: So if we say that npm run dev,
>> Sean Larkin: All right, the process doesn't exit and it just shows this feedback.

[00:00:47]
But what's great now is why don't we even just jump into nav, what if we wanted to change this? What if we wanted to instead have it be a function that calls and returns the string literal nav. [LAUGH] Now of course, our code would look a little different, so if this is a function that returns a nav string, that means we now have to call nav if we wanna get the string back, right?

[00:01:16]
But you can see slowly in your terminal feedback as you're changing that. So, let me see if I can get both of them up in the same, both files. It'll be helpful. Oops.
>> Sean Larkin: There we go. But as you make changes, web pack is just incrementally compiling. It just changes whatever modules you're working with.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now