Published on

vue+laravel终极混合开发模式部署

Authors
  • avatar
    Name
    Hansuku
    Twitter

这几天终于开始捣腾 SPA 了,其实 vue+laravel 是可以做前后端分离的,只是我们一个大项目里包裹了两个小项目,现在还是混合开发,但是配置上来说走了蛮多坑,这里也分享一下.友情提醒这篇文章只适合使用过 vue 的旁友!!! 本身在之前我们一直是用 laravel 视图做不需要交互的数据绑定,而 laravel5.4 版本自带 vue,所以如果你们也是这样开发的,你们的项目里应该会有个这玩意

没错!!!打开它,你会看到 laravel 已经给配置了 vue 的环境

你只要在项目目录npm install --save-dev就可以把这些环境都装下来 然后,接下来是重头戏,很多刚刚前后端分离的人也会搞混,网上也很少有资料 敲黑板请前端同学记住,vue+laravel 模式,是后台只给一个 blade.php 模板文件,剩下的,全都自己在 resources/assets/js 下面写!包括路由!js,sass 等等! 来一张结构图 然后!关键的来了,我们写的东西怎么引用到 blade.php 模板引擎上去? 打开你的终端!到项目目录,npm run dev 如果你没有配错路由写错语法等等自己写错的情况,现在会用 laravel-mix 帮你在项目根目录/public/js/下生成 app.js 然后我们到 blade.php 上引用刚刚生成的 app.js 即可! laravel-mix 是啥?这就是一个超级无敌缩减版的 webpack,具体可以看官方 github:laravel-mix 目前这种工作方式对于直接用 ftp 在服务器上写代码的同学不是很友好,因为你改完一个 vue 文件 laravel-mix 可以自动打包,但是 app.js 需要你手动 ftp 上传..如果在本地有 docker 环境的同学!!恭喜你,你找到了前端敲代码怎么爽怎么来的方法

*/}