搭建 Laravel + Vue 的开发环境需要配置 PHP、Composer、Node.js、npm/yarn，以及数据库等工具。以下是完整的环境搭建步骤：

一、安装基本环境

1. 安装 PHP(Laravel 需要 PHP 7.4+ 或 8.x)

Windows: 下载 PHP

Ubuntu(推荐使用 apt 安装)

sudo apt update
sudo apt install php php-cli php-mbstring php-xml php-bcmath unzip curl

Mac(使用 Homebrew)

brew install php

2. 安装 Composer

Laravel依赖 Composer 进行依赖管理。

curl -sS https://getcomposer.org/installer | php
sudo mv composer.phar /usr/local/bin/composer

验证安装：

composer -V

3. 安装 Node.js & npm/yarn

Vue 需要 Node.js 环境。

Windows & Mac: 下载 Node.js

Ubuntu

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt install -y nodejs

安装 npm 或 yarn

npm install -g npm

npm install -g yarn

验证安装

node -v

npm -v

yarn -v

二、创建 Laravel 项目

在终端运行：

composer create-project --prefer-dist laravel/laravel my-laravel-vue-app

进入项目目录：

cd my-laravel-vue-app

启动 Laravel 内置服务器：

php artisan serve

如果一切正常，访问 http://127.0.0.1:8000 可以看到 Laravel 欢迎页面。

三、配置 Laravel 前端 Vue

1. 安装 Laravel UI(可选)

Laravel 默认使用 Vite 作为前端构建工具，如果你希望手动安装 Vue，可以执行：

composer require laravel/ui
php artisan ui vue
npm install && npm run dev

如果是 Laravel 10+ 版本，直接使用：

npm install

npm run dev

2. 安装 Vue 及相关依赖

npm install vue@next vue-loader@next vue-router@4 @vitejs/plugin-vue --save-dev

安装 Pinia(Vuex 替代品，可选)

npm install pinia

3. 配置 vite.config.js

在 vite.config.js 中添加：

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

export default defineConfig({
    plugins: [vue()],
    server: {
        host: '127.0.0.1',
        port: 5173,
    },
});

四、创建 Vue 组件

在 resources/js 目录下创建 app.js：

import { createApp } from 'vue';
import App from './components/App.vue';

createApp(App).mount('#app');

创建 resources/js/components/App.vue：

<template>
  <div>
    <h1>Hello Laravel + Vue!</h1>
  </div>
</template>
<script>
export default {
  name: 'App'
};
</script>

在 resources/views/welcome.blade.php 添加：

<div id="app"></div>
<script type="module" src="/resources/js/app.js"></script>

五、运行项目

执行：

npm run dev  # 启动 Vite
php artisan serve  # 启动 Laravel

访问 http://127.0.0.1:8000 就能看到 Vue 渲染的页面。

六、数据库(可选)

如果需要 MySQL：

sudo apt install mysql-server

配置 .env：

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=mydb
DB_USERNAME=root
DB_PASSWORD=yourpassword

运行迁移：

php artisan migrate

这样，你就完成了 Laravel + Vue 的开发环境搭建!