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

cordy's avatar
Level 1

How to compile assets for production with vite in laravel?

I am working on a laravel10 / vue3 project. i use npm run dev to compile the assets and everything seems to work fine. i tried to run npm run build for the first time and i got this error:

[vite]: Rollup failed to resolve import "/icons/coreui.svg" from "C:/xampp/htdocs/project/resources/js/layouts/Product/Update.vue".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
error during build:
Error: [vite]: Rollup failed to resolve import "/icons/coreui.svg" from "C:/xampp/htdocs/project/resources/js/layouts/Product/Create.vue".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

when i run npm run dev i dont get this error and the icon get displayed correctly.

<svg class="me-1 mb-1" width="20" height="20">
    <use xlink:href="/icons/coreui.svg#cil-save"></use>
</svg>

vite.config.js:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
import path from 'path';


export default defineConfig({
    plugins: [
        vue(),
        laravel({
            input: [
                'resources/sass/app.scss',
                'resources/sass/style.scss',
                'resources/js/app.js',
            ],
            refresh: true,
        }),
    ],
    resolve: {
        alias: {
            '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
        }
    },
});
0 likes
1 reply
vincent15000's avatar
Level 63

It seems that you have an absolute path.

import "/icons/coreui.svg"

You should use a relative path.

1 like

Please or to participate in this conversation.