无法加载/vercel/path0/vendor/tightenco/ziggy/dist/vue.es.js

Question

您好，我在尝试在 vercel 上部署我的 Laravel、Inertia、Vite、Vue 应用程序时遇到问题。

我在本地主机中测试我的应用程序没有错误，一切正常......

Vercel 安装打印此错误：

[vite:load-fallback] 无法加载 /vercel/path0/vendor/tightenco/ziggy/dist/vue.es.js （由 resources/js/app.js 导入）：ENOENT：没有这样的文件或目录，打开'/vercel/path0/vendor/tightenco/ziggy/dist/vue.es.js' 构建过程中出错： 错误：无法加载/vercel/path0/vendor/tightenco/ziggy/dist/vue.es.js（由resources/js/app.js导入）：ENOENT：没有这样的文件或目录，打开'/vercel/path0/供应商/tightenco/ziggy/dist/vue.es.js' 错误：命令“npm run build”以 1 退出

这是我的 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: [
        laravel({
            input: ["resources/css/app.css", "resources/js/app.js"],
            refresh: true,
        }),
        vue({
            template: {
                base: null,
                includeAbsolute: false,
            },
        }),
    ],
    resolve: {
        alias: {
            ziggy: path.resolve(
                __dirname,
                "vendor/tightenco/ziggy/dist/vue.es.js"
            ),
        },
    },
});

这是我的 app.js 文件：

import { createApp, h } from "vue";
import { createInertiaApp } from "@inertiajs/vue3";
import MainLayout from "@/Layouts/Mainlayout.vue";
import { ZiggyVue } from "ziggy";

createInertiaApp({
    progress: {
        // The delay after which the progress bar will appear, in milliseconds...
        delay: 250,

        // The color of the progress bar...
        color: "#29d",

        // Whether to include the default NProgress styles...
        includeCSS: true,

        // Whether the NProgress spinner will be shown...
        showSpinner: false,
    },
    resolve: (name) => {
        const pages = import.meta.glob("./Pages/**/*.vue", { eager: true });
        let page = pages[`./Pages/${name}.vue`];
        page.default.layout = page.default.layout || MainLayout;
        return page;
    },
    setup({ el, App, props, plugin }) {
        createApp({ render: () => h(App, props) })
            .use(plugin)
            .use(ZiggyVue)
            .mount(el);
    },
});

如何用 vercel 修复？ 谢谢你

Answer 1

我不使用 Vercel，而是 Heroku。我通过反转 Heroku 设置中的 Php 和 Node Buildpack 修复了此问题。需要先运行 Php，然后是 Nodjs（需要先安装 Composer）。

您必须针对其他主机站点进行调整。