You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Laravel+Inertia+Vue3计算属性在Dev与Build模式下表现差异问询

Laravel 10 + Inertia + Vue3 + Vite开发中dev与build模式代码表现不一致问题

在使用Laravel 10.x、Inertia、Vue JS 3及Vite开发时,发现代码在npm run dev和npm run build模式下表现不一致:

相关组件代码(Tracker.vue)

<script setup>
    import { Head, router, usePage } from '@inertiajs/vue3'
    import { ref, reactive, computed } from 'vue'
    //*** 更多导入 ***/

    const page = usePage();
    const user = computed(() => page.props.auth.user);

    [...]

    function anyFunction()
    {
        // this.user.interval在npm run dev模式下可用,但npm run build模式下不可用
        console.log(this.user.interval) // npm run dev可用,build不可用
        console.log(user.value.interval) // dev和build模式下均可用
        return true
    }

    // 其余代码...无关部分
</script>

关键差异:

  • this.user.interval:仅在npm run dev模式下能正常输出,npm run build模式下无法访问
  • user.value.interval:在两种模式下均能正常工作

Vite配置文件(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,
                },
            },
        }),
    ],
    build: {
        minify: true //调试build时可改为false
    }
});

Package.json配置

{
    "private": true,
    "type": "module",
    "scripts": {
        "dev": "vite",
        "build": "vite build"
    },
    "devDependencies": {
        "@inertiajs/vue3": "^1.0.0",
        "@popperjs/core": "^2.11.8",
        "@tailwindcss/forms": "^0.5.3",
        "@vitejs/plugin-vue": "^4.0.0",
        "autoprefixer": "^10.4.12",
        "axios": "^1.1.2",
        "bootstrap": "^5.2.3",
        "bootstrap-icons": "^1.10.5",
        "laravel-vite-plugin": "^0.8.0",
        "postcss": "^8.4.18",
        "sass": "^1.56.1",
        "tailwindcss": "^3.2.1",
        "vite": "^4.0.0",
        "vue": "^3.2.41"
    },
    "dependencies": {
        "@inertiajs/vue3": "^1.0.11",
        "@vitejs/plugin-vue": "^4.3.4",
        "vue3-colorpicker": "^2.2.2"
    }
}

请问这是预期行为还是遇到了bug?如需更多信息请告知,感谢您的帮助!

内容的提问来源于stack exchange,提问作者Christian

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.09 20:49:55