如何使用 Laravel index.php 服务 Vue-CLI

Posted 2023-02-22

【中文标题】如何使用 Laravel index.php 服务 Vue-CLI

【英文标题】：How to Serve Vue-CLI using Laravel index.php

【发布时间】：2019-05-26 02:20:59

【问题描述】：

我买了一个使用 vue-cli 的 Vue 模板。问题是，当我运行 npm run dev 时，应用程序正在运行 http://localhost:8080/

我已经在 https://develop.local/ 运行了 laravel

vue-cli服务器如何运行到https://develop.local/（开发模式下）？

如何配置和移动index.html（从vue目录）到laravel的resources/views/index.blade.php，以便可以被laravel的public/index.php处理？

非常感谢。

【问题讨论】：

如果你使用vue-cli你不能同时在一个域名下运行，使用laravel作为api的后端和vue作为前端。

直接由 Vue.js 的创建者 Evan You 为您带来：github.com/yyx990803/laravel-vue-cli-3

@andcl 这很酷，我已经设法让我的项目工作了

【参考方案1】：

Laravel 已经为你配置好了。因此，要在 Laravel 中使用 Vue，您必须安装 laravel-mix 和 vuejs 依赖项。您可以通过在终端中运行 npm install 命令来做到这一点。

之后，您应该使用vue 组件。您可以将任何组件添加到任何刀片页面中。您必须在该页面中添加 app.js。不要忘记运行 npm run watch 命令来构建所有自定义 javascript 代码。

【参考方案2】：

你需要一点 Laravel 知识。Laravel 主要使用与 VueJs 或其他 javascript lib 相关的 resources\assets\js 文件夹。 VueJs 组件需要位于 resources\assets\js\components 文件夹下。

首先你可以编译你买的vuejs模板，根据resources\assets\js和 resources\assets\js\components 文件夹。之后，您可以在 resources/views/index.blade.php 或其他刀片页面上使用您的组件。

其余的是 Laravel 业务。