Laravel10-React环境搭建(备忘录)

laradock下载

启动容器

请使用sudo docker compose up -d nginx postgres pgadmin。

Bash登录

使用Docker Compose,在工作空间中执行Bash命令。

Laravel10 下载

使用composer创建一个名为laravel的项目。

使用Composer将Laravel Breeze包添加到项目中。

使用composer命令来安装Laravel Breeze开发工具依赖包,命令如下:composer require laravel/breeze –dev。

安装Breeze包,并将React设置为前端框架。

使用PHP艺术家的命令,安装 React

仅需第一次启动前执行的前台服务器启动所需步骤。

安装20.5.0版本的nvm
使用20.5.0版本的nvm
全局安装npm@10.2.2
安装npm

前端服务器的启动

运行 “npm run dev”

编辑app.php

为了创建虚假数据,将其本地化为中文。

‘locale’ => ‘ja’,
‘fallback_locale’ => ‘ja’,
‘faker_locale’ => ‘ja_JP’,

设置数据库信息

DB_CONNECTION=pgsql
DB_HOST=postgres
DB_PORT=5432
DB_DATABASE=default
DB_USERNAME=default
DB_PASSWORD=secret

vite配置文件。

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,
        }),
        react(),
    ],
    // 以下追加
    server: {
        host: true,
        hmr: {
            host: "localhost",
        },
    },
});

bannerAds