How to start json-server with webpack?

Question

I use webpack with my frontend project and I also use json-server as a backend.

Now I separately start json-server and the frontend project. It is not convenient to do so always.

Is there a way to somehow configure webpack that it could start json-server itself before running the project?

Answer 1

I'm not sure about configuring webpak-dev-server to start json-server but my approach was to use concurrently to launch json-server and webpack-dev-server in parallel from my package.json file.

1. Add concurrently as a dev dependency

   yarn add concurrently --dev
   

2. Configure package.json to launch both json-server and webpack-dev-server

   "scripts": {
     "start": "concurrently --kill-others \"yarn start-json-server\" \"yarn start-webpack-dev-server\"",
     "start-json-server": "json-server --watch ./src/demo/db.json --port 3030",
     "start-webpack-dev-server": "webpack-dev-server --config ./src/demo/webpack.config.js --open",
   }
   

3. Start developing

   yarn start
   

Related: https://stackoverflow.com/a/30950298/19977