以前是写PHP的,转前端两年了吧~以前写Laravel比较多,先后在百度、大疆实习,总结一下,不知道对你有没有帮助。
Blade下的Vue
包括Laravel在内的主流PHP框架都是MVC架构的,在视图层通常都有自己的模板引擎。所以在大一入门的时候我一般是这样写的。
编写一个Laravel的模板文件,传进来PHP的变量并渲染。
-
<html>
-
<body>
-
<h1>{{ $hello }}</h1>
-
</body>
-
</html>
通过script标签引入Vue,然后在标签内写vue的逻辑。
<script src="js/vue.min.js"></script>
配合axios这些ajax库,前端就可以只写在resources/views文件夹里,不用管其他的了。
构建工具下的Vue
后来觉得没有NPM和Node实在太不方便了,于是单独建立了前端页面的文件夹,编译到resources/views文件夹里,不过不久之后Laravel就提供了一体化的构建工具。
Laravel Mix提供了一个管道,可以流式编译CSS和JS。
-
mix.js('resources/assets/js/app.js', 'public/js')
-
.sass('resources/assets/sass/app.scss', 'public/css');
类似于Gulp,也是在Node上面跑起来的。
-
npm install
-
npm run dev
-
npm run production
在app.js里面注册组件。
-
// app.js
-
Vue.component('example', require('./components/Example.vue'));
然后就可以直接写在PHP的模板里面了。
-
@extends('layouts.app')
-
-
@section('content')
-
<example></example> // 这里是使用vue组件的
-
@endsection
其实原理还是和之前手动编译的一样,先通过webpack翻译组件,生成正常的PHP模板,给PHP调用。
分离与转发
再后来,前端和后端项目在一台服务器,一个文件夹里,太窝囊了,也不利于扩展。因此,大家开始使用Node转发。
这里后端的工作一般是:
- 编写Lumen代码,提供服务
- 写好Restful的API文档
- 用postman进行测试
前端的工作一般是:
- 编写Vue代码
- 打包编译
- 使用Node转发API请求,解决跨域问题
- 使用PM2处理并发请求
结束
现在写JS比较多了,发现中间层用Koa、express也不错,所以好久都没有用PHP了。现在工作中大部分都是CMS的业务,后端JAVA比较多,前端就直接转发了JAVA的接口。就这样吧,希望对你有所帮助咯,以上。
https://www.zhihu.com/question/67171606
评论(0)