reflect changes in devServer without need to reload Node server (Webpack & Vue-cli)

Question

Let's say I have a Vue CLI project that uses this vue.config.js:

module.exports = {
  ...
  devServer: {        
    before: function(app, server, compiler) {
        app.get('/my_response', function(req, res) {                
            res.json({ custom: 'Hello world' });
        });
    },
  }
}

To run the server, everytime I use:

yarn serve

However, once the localhost server is live, and from the front-end, I make AJAX (axios, etc) requests to the /my_response endpoint, the front-end gets a response, but if i change "hello world", AJAX doesn't get the changed value until yarn serve is restarted.

How can I make it so that when I change the backend logic in vue.config.js, it wouldn't need a server restart?

tony19 · Accepted Answer · 2020-10-12 02:51:49Z

2

As of Vue CLI 4.5.7, there's no built-in support for hot-reloading vue.config.js.

A workaround is to install npm-watch, and edit your package.json to include the following:

{
  "watch": {
    "serve": "vue.config.js"
  },
  "scripts": {
    "watch": "npm-watch"
  }
}

answered Oct 12, 2020 at 2:51

tony19

140k23 gold badges281 silver badges354 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

reflect changes in devServer without need to reload Node server (Webpack & Vue-cli)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related