Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

eggplantSword's avatar

net::ERR_CONNECTION_REFUSED

I'm trying to use Vue 3 + Inertia, I installed it using Breeze. I get this error in the console like this and I get a blank page.

http://[::1]:5173/@vite/client net::ERR_CONNECTION_REFUSED
http://[::1]:5173/resources/js/app.js net::ERR_CONNECTION_REFUSED
http://[::1]:5173/resources/js/Pages/Test.vue net::ERR_CONNECTION_REFUSED

I'm not sure which files are relevant but here are some important ones

//composer.json
...
   "require": {
        "php": "^8.0.2",
        "aacotroneo/laravel-saml2": "^2.1",
        "guzzlehttp/guzzle": "^7.2",
        "inertiajs/inertia-laravel": "^0.6.3",
        "laravel/framework": "^9.19",
        "laravel/sanctum": "^2.8",
        "laravel/tinker": "^2.7",
        "sal/idp-sdk": "dev-master",
        "tightenco/ziggy": "^1.0"
    },
    "require-dev": {
        "fakerphp/faker": "^1.9.1",
        "laravel/breeze": "^1.14",
        "laravel/pint": "^1.0",
        "laravel/sail": "^1.0.1",
        "mockery/mockery": "^1.4.4",
        "nunomaduro/collision": "^6.1",
        "phpunit/phpunit": "^9.5.10",
        "spatie/laravel-ignition": "^1.0"
    },
...

//package.json
{
    "private": true,
    "scripts": {
        "dev": "vite",
        "build": "vite build"
    },
    "devDependencies": {
        "@inertiajs/inertia": "^0.11.0",
        "@inertiajs/inertia-vue3": "^0.6.0",
        "@inertiajs/progress": "^0.2.7",
        "@tailwindcss/forms": "^0.5.3",
        "@vitejs/plugin-vue": "^3.0.0",
        "autoprefixer": "^10.4.12",
        "axios": "^1.1.2",
        "laravel-vite-plugin": "^0.6.0",
        "lodash": "^4.17.19",
        "postcss": "^8.4.18",
        "tailwindcss": "^3.2.1",
        "vite": "^3.0.0",
        "vue": "^3.2.41"
    }
}


//app.js
import './bootstrap';
import '../css/app.css';

import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/inertia-vue3';
import { InertiaProgress } from '@inertiajs/progress';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';

const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./Pages/**/*.vue')),
    setup({ el, app, props, plugin }) {
        return createApp({ render: () => h(app, props) })
            .use(plugin)
            .use(ZiggyVue, Ziggy)
            .mount(el);
    },
});

InertiaProgress.init({ color: '#4B5563' });


//vite.config.js
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
    plugins: [
        laravel({
            input: 'resources/js/app.js',
            refresh: true,
        }),
        vue(),
    ],
});

//routes web.php
Route::middleware('auth')->group(function () {
    Route::get('/', function () {
        return Inertia::render('Test', ['data' => 'dddd']);
    })->name('dashboard');
});

//Test.vue
<script setup>
</script>

<template>
    <h1>Dashboard</h1>
    {{$page.props}}
</template>

How can I fis this issue?

0 likes
6 replies
idew's avatar

This looks like a misconfiguration of some sort. Is port 5173 open on your machine? is the APP_URL set properly in your .env file?

eggplantSword's avatar

@allantmuzeya Not sure I remember what I did as this was a long time ago, but here is the server part of my vite.config where the host is setup

server: {
        host: true,

        hmr: {
            host: '127.0.0.1',
        },

        watch: {
            usePolling: true,

            ignored: ["**/vendor/**"],
        }
    },

Please or to participate in this conversation.