laravel vite在使用惯性js vue时出现黑屏答案

【问题标题】：laravel vite blank screen when using inertiajs vuelaravel vite在使用惯性js vue时出现黑屏
【发布时间】：2022-10-14 23:38:34
【问题描述】：

我在运行 npm run dev 后没有修改任何内容，使用轻风和 vue 预设进行了全新的 laravel 安装，其中应用程序运行良好我退出它然后执行 npm run build 但应用程序进入空白屏幕，控制台出现错误

请问我该如何解决这个问题

下面控制台中的错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1:5173/@vite/client. (Reason: CORS request did not succeed). Status code: (null).

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1:5173/resources/js/app.js. (Reason: CORS request did not succeed). Status code: (null).

我的 composer.json

{
    "name": "laravel/laravel",
    "type": "project",
    "description": "The Laravel Framework.",
    "keywords": ["framework", "laravel"],
    "license": "MIT",
    "require": {
        "php": "^8.0.2",
        "guzzlehttp/guzzle": "^7.2",
        "inertiajs/inertia-laravel": "^0.5.4",
        "laravel/framework": "^9.19",
        "laravel/sanctum": "^2.8",
        "laravel/tinker": "^2.7",
        "tightenco/ziggy": "^1.0"
    },
    "require-dev": {
        "fakerphp/faker": "^1.9.1",
        "laravel/breeze": "^1.11",
        "laravel/pint": "^1.0",
        "laravel/sail": "^1.0.1",
        "mockery/mockery": "^1.4.4",
        "nunomaduro/collision": "^6.1",
        "phpunit/phpunit": "^9.5.10",
        "spatie/laravel-ignition": "^1.0"
    },
    "autoload": {
        "psr-4": {
            "App\": "app/",
            "Database\Factories\": "database/factories/",
            "Database\Seeders\": "database/seeders/"
        }
    },
    "autoload-dev": {
        "psr-4": {
            "Tests\": "tests/"
        }
    },
    "scripts": {
        "post-autoload-dump": [
            "Illuminate\Foundation\ComposerScripts::postAutoloadDump",
            "@php artisan package:discover --ansi"
        ],
        "post-update-cmd": [
            "@php artisan vendor:publish --tag=laravel-assets --ansi --force"
        ],
        "post-root-package-install": [
            "@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
        ],
        "post-create-project-cmd": [
            "@php artisan key:generate --ansi"
        ]
    },
    "extra": {
        "laravel": {
            "dont-discover": []
        }
    },
    "config": {
        "optimize-autoloader": true,
        "preferred-install": "dist",
        "sort-packages": true
    },
    "minimum-stability": "dev",
    "prefer-stable": true
}

【问题讨论】：

标签： laravel vite inertiajs

【解决方案1】：

我希望您的项目在http://localhost 上运行。在您的vite.config.js 中添加server.host 配置后尝试。它应该如下所示。

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

export default defineConfig({
    server: {
        host: '0.0.0.0'
    },
    plugins: [
        laravel({
            input: 'resources/js/app.jsx',
            refresh: true,
        }),
        react(),
    ],
});

【讨论】：