![how to run webpack-devserver https how to run webpack-devserver https](https://programmerah.com/wp-content/uploads/2021/03/2019050715223032.png)
So when I hit save, the Webpack dev server will detect the change, and it is going to bundle everything up again.
![how to run webpack-devserver https how to run webpack-devserver https](https://i.stack.imgur.com/sfF6q.png)
Let’s set the text to “Hello from webpack-dev-server”. We’re going to open index.js, and I will make a small change in our application. Now let’s go back to our code to ensure that this is working as expected. So let’s go back over to the terminal, so I can say npm run serve, you can see that the same Webpack build steps from before are being performed, and this will tell me that the project is running at localhost:3000. Let’s add another script here called “serve”, and this is going to use. So at this point, I will open up our package.json file. Create an NPM Script to Run the Webpack Dev Server It will tell the dev server to open your default browser after the server had been started. I’m then going to add another property called “open” and set it to true.
![how to run webpack-devserver https how to run webpack-devserver https](https://i.stack.imgur.com/VDcW8.png)
We will then add a “contentBase”, which will tell the dev server where to serve the content from, and it will be set to path.join(_dirname, 'dist').Īnd then, we want to specify which port the server should run on. Once this is installed, we can go back to our Webpack config, and we’re going to add another node called “devServer”. Configure Webpack 5 to use webpack-dev-server
#HOW TO RUN WEBPACK DEVSERVER HTTPS INSTALL#
So I will say npm install -save-dev webpack-dev-server. I’m then going to install the Webpack dev server into dev dependencies. To set up the Webpack dev server, I’m going to navigate to my project directory.