Npm run dev with specific url

[pbellerive]

Hi,
I usually use Laravel + vuejs.
But for a new projet it's a vuejs projet + backend
For dev when i do npm run dev, the server start on localhost:5174.
How can i set node to listen on a specific url tha is a subdomain of my backend url.

I tried npm run dev --host myhost.
Not working

Thanks

[typed-sigterm]

Vite server is only for development. In production, you can vite build and use nginx/apache.

[ctkqiang]

Hi, I usually use Laravel + vuejs. But for a new projet it's a vuejs projet + backend For dev when i do npm run dev, the server start on localhost:5174. How can i set node to listen on a specific url tha is a subdomain of my backend url.

I tried npm run dev --host myhost. Not working

Thanks

I understand what you are trying to do in the dev environment. Actually, you can configure this directly in your vite.config.js file. Below is a template from my recent project that you can use or adapt as needed:

import { fileURLToPath, URL } from 'node:url';
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(), // Enables Vue.js plugin
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url)), // Shorten the import path for the `src` directory
    },
  },
  server: {
    host: '0.0.0.0', // Allow access from all network interfaces, You adjust it from here 
    port: 80, // Set the server port
    strictPort: true, // Prevent running on a different port if the specified one is in use
    hmr: {
      host: 'localhost', // Ensures Hot Module Replacement (HMR) works correctly
    },
    proxy: {
      '/api': {
        target: '{MY_PRIVATE_PROXY_URL}, // Target API server for requests
        changeOrigin: true, // Handle virtual hosted sites by updating the host header
        rewrite: (path) => path.replace(/^\/api/, ''), // Remove '/api' prefix before sending requests to the target server
      },
    },
  },
});

then proceed to run

npm run dev

which you will see something as below:

  VITE v5.4.4  ready in 588 ms

  ➜  Local:   http://localhost:80/
  ➜  Network: http://172.xx.xxx.xx:80/
  ➜  Network: http://169.xxx.xxx.xxx:80/
  ➜  press h + enter to show help

I hope this helps! 😇