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

graememullins's avatar

Vite Build

Hi,

When I run npm run build, the assest on live are not showing and link to: http://[::1]:5175/resources/css/app.css and http://[::1]:5175/resources/js/app.js as an example.

I'm pulling in @vite(['resources/css/app.css', 'resources/js/app.js']) to the app.blade.php file.

Graeme

0 likes
2 replies
LaryAI's avatar
Level 58

It seems like you are experiencing an issue with the asset links when running the npm run build command. The asset links are pointing to http://[::1]:5175 instead of the expected URLs.

To fix this issue, you need to configure the base URL for your assets in your Vite configuration file. By default, Vite assumes that your assets will be served from the root directory (/), but in your case, it seems like they are being served from a different URL.

In your Vite configuration file (vite.config.js), you can specify the base option to set the base URL for your assets. Assuming your assets are served from the /resources directory, you can set the base option to /resources/:

// vite.config.js
module.exports = {
  base: '/resources/',
};

After making this change, run the npm run build command again, and the asset links should now point to the correct URLs.

Note: Make sure to adjust the base option value according to your actual asset directory structure.

Let me know if you need further assistance!

graememullins's avatar

This didn't work, here's my vite config:

I've replaced the urls with placeholders for privacy.

import { defineConfig } from 'vite'; import laravel from 'laravel-vite-plugin';

const isProduction = process.env.NODE_ENV === 'production'; const isStaging = process.env.NODE_ENV === 'staging';

export default defineConfig({ plugins: [ laravel({ input: [ 'resources/css/app.css', 'resources/js/app.js', ], refresh: true, }), ], base: isProduction ? 'https://LIVE_SERVER/' : isStaging ? 'https://DEV_SERVER/' : 'http://127.0.0.1:8000/', server: { hmr: !isProduction, // Enable HMR in non-production environments }, build: { // Specify output directory for production build outDir: 'public/build', // Adjust this path as needed }, });

Please or to participate in this conversation.