phanthai12's avatar

Unable to locate file in Vite manifest: resources/js/Pages/Welcome.vue.

the problem occurs when i execute the command yarn build

  • Version: PHP 8.1.7 Laravel 9.45.1
  • My 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({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false,
                },
            },
        }),
    ],
});
  • in my public/build/manifest.json 
{
 //...
  "resources/js/app.js": {
    "file": "assets/app-55b752c4.js",
    "src": "resources/js/app.js",
    "isEntry": true,
    "dynamicImports": [
      "resources/js/Pages/Auth/ConfirmPassword.vue",
      "resources/js/Pages/Auth/ForgotPassword.vue",
      "resources/js/Pages/Auth/Login.vue",
      "resources/js/Pages/Auth/Register.vue",
      "resources/js/Pages/Auth/ResetPassword.vue",
      "resources/js/Pages/Auth/VerifyEmail.vue",
      "resources/js/Pages/Dashboard.vue",
      "resources/js/Pages/Profile/Edit.vue",
      "resources/js/Pages/Profile/Partials/DeleteUserForm.vue",
      "resources/js/Pages/Profile/Partials/UpdatePasswordForm.vue",
      "resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.vue",
      "_Welcome-0432c34d.js"
    ],
    "css": [
      "assets/app-9dd22145.css"
    ]
  }
}
0 likes
10 replies
phanthai12's avatar

it worked with yarn dev, but when yarn build it not worked

Zayar's avatar

Hi did you find a solution to this problem? Cause I am having this issue too.

1 like
Sinnbeck's avatar

@Zayar they already said? yarn dev, does not make a manifest.json file. yarn build does

If your problem is more complex, make a new thread please :)

Zayar's avatar

@Sinnbeck But after running npm run build, this is not supposed to happen right?

Sinnbeck's avatar

@Zayar No. But as I said, if it does not work, please make your own thread and we will help out

1 like
nigelheap's avatar

Just in case you didn't find a solution... What fixed this for me was making sure I had the resolve option set correctly in your main js input file.

The glob + resolvePageComponent tells vite to go and build all those dynamic pages

....
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';

createInertiaApp({
  title: (title) => `${title} - ${appName}`,
  resolve: (name) =>
    resolvePageComponent(
      `./Pages/${name}.vue`,
      import.meta.glob('./Pages/**/*.vue')
    ),
...
2 likes
aminashofteh's avatar

Hello everyone, In my situation (Inertia by react) , it was very simple, unfounded index.jsx file should be renamed to Index.jsx ( i from lower-case to I upper-case ) , and then run the : npm run build. after that problem is solved. Thanks, Hope to God

2 likes
dntrung044's avatar

You should check the capital letters in the folder. I fixed it by changing "./Pages/..." to "./pages/...".

2 likes
ephraimlambarte's avatar

i have solved this by simply removing the second item in the @vite() method in your app.blade.php .

change it from this: @vite(['resources/js/app.js', "resources/js/Pages/{$page['component']}.vue"]) to this: @vite(['resources/js/app.js'])

1 like

Please or to participate in this conversation.