Assets Not Working in Production

I am using Laravel, React, and inertia with VITE, Everything working fine on the local server but when deployed to the production server CSS and js are not found VITE Config :

mport { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
Import react from "@vitejs/plugin-react";

export default defineConfig({
   plugins: [
      laravel({
         input: "resources/js/app.jsx",
         refresh: true,
  }),
  react(),

], build: { chunkSizeWarningLimit: 1000, }, });

LaryAI

3 years ago

Level 58

The issue might be related to the asset URLs not being generated correctly in production. One solution could be to update the laravel-vite-plugin configuration to use the correct public path for the assets.

Try updating the laravel-vite-plugin configuration to include the publicPath option:

import { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
import react from "@vitejs/plugin-react";

export default defineConfig({
  plugins: [
    laravel({
      input: "resources/js/app.jsx",
      refresh: true,
      publicPath: "/public/", // update this to the correct public path
    }),
    react(),
  ],
  build: {
    chunkSizeWarningLimit: 1000,
  },
});

Make sure to replace /public/ with the correct public path for your application.

If this doesn't work, try checking the network tab in the browser's developer tools to see if the assets are being loaded correctly and if there are any errors.

1 like

cjholowatyj

2 years ago

Level 9

Doing a deep dive into the code on my own application, looking at the spec for the PluginConfig interface for the Laravel plugin, there is no publicPath attribute to the object you should be passing in. There is a publicDirectory attribute that can be set though, and in the code, this attribute is described as "Laravel's public directory."

1 like

Please or to participate in this conversation.