Is there anyway to start a proxy server script from in the vite.config.ts script. Here is what I am using for define config:

  plugins: [react()],
  server : {
    host: "192.168.1.118",
    port: 5173,
    proxy: {
      '/api': {
      target: 'http://192.168.1.118:3001',
      changeOrigin: true,
      },
    },
  },
})

My goal is to be able to have vite start both the react server & the proxy server which will be functioning as middle ware for server side operations. The proxy server script is typescript file: "server.ts"

If this isn't possible what is the best way to autostart the proxy server when the react server is started? I am trying to make this as clean as possible & it seems like have vite start both would be the best way to go.

FYI: I am a beginner with react and vite. I am also learning typescript.

Thank You

Is there anyway to start a proxy server script from in the vite.config.ts script. Here is what I am using for define config:

  plugins: [react()],
  server : {
    host: "192.168.1.118",
    port: 5173,
    proxy: {
      '/api': {
      target: 'http://192.168.1.118:3001',
      changeOrigin: true,
      },
    },
  },
})

My goal is to be able to have vite start both the react server & the proxy server which will be functioning as middle ware for server side operations. The proxy server script is typescript file: "server.ts"

If this isn't possible what is the best way to autostart the proxy server when the react server is started? I am trying to make this as clean as possible & it seems like have vite start both would be the best way to go.

FYI: I am a beginner with react and vite. I am also learning typescript.

Thank You

• reactjs
• typescript
• proxy
• vite

Share Improve this question Follow asked Mar 21 at 2:38 Guy TechGuy Tech 911 bronze badge 1

• Try using nodemon for Proxy Server 1) npm install concurrently nodemon ts-node --save-dev 2) Add scripts to package.json "scripts": { "dev": "concurrently \"npm run proxy\" \"vite\"", "proxy": "nodemon --watch server.ts --exec ts-node server.ts" } 3) Now, npm run dev will: Start Vite Start (and restart if you change it) your proxy server. – shruti Commented Mar 21 at 6:36

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You can’t directly start a proxy server from vite.config.ts, but the best way is to use concurrently in your package.json scripts:

1. Install concurrently

npm install concurrently

2. Update package.json

"scripts": {
  "dev": "concurrently \"vite\" \"npx ts-node server.ts\""
}

3. Run it

npm run dev

This starts both Vite and your proxy server together, showing logs for both. Clean & simple!

---

If your server.ts file is in a different folder (e.g., inside backend/), you need to specify the correct path in package.json like this:

"scripts": {
  "dev": "concurrently \"vite\" \"npx ts-node ./backend/server.ts\""
}

Make sure to adjust the path based on where your server.ts file is located. Now it’ll work smoothly!