PHPTODO:搭建Laravel VueJS SemanticUI

TODO:搭建Laravel VueJS SemanticUI

PHP 1

Laravel是一样效简洁、优雅的PHP开发框架(PHP Web
Framework)。可以于您从面条一样纷纷扬扬的代码中摆脱出来;它可以助你构建一个圆满的网络APP,而且每行代码都可简单、富于表达力。

VueJS是如出一辙暂缓渐进式JavaScript框架,有着易用,灵活,高效之略微。简单小巧的主导,渐进式技术栈,足以应付任何规模之应用。

SematicUI 是全然语义化的前端界面开发框架,跟 Bootstrap 和 Foundation
比起来,还是有些不同之,在功能特色上、布局规划达到、用户体验及全在许多异样。易于学习及采取,对于社区贡献来说是于开放的。有一个特别好之按钮实现,情态动词,和快长达。在多效能上用图标字体。

  1. 创建Laravel项目

composer create-project laravel/laravel 项目名称,网速有硌款而稍齐

PHP 2

  1. 运转npm install安装nodejs对应的管教

3.
布置bower,bower是何?Bower是一个客户端技术之软件包管理器,它不过用来搜索、安装与卸载如JavaScript、HTML、CSS之类的网络资源。在这里主要用于管理html5shiv,semantic。需要补充加点儿个布局bower.json管理要因此底js包,还有一个配置文件.bowerrc用于管理变的文本夹路径。安装方式好粗略npm直接可以装(npm
install bower);项目安装bower配置的网资源,则运行bower install。

4.
因和nodejs的条件,安装这些工具还分外省心。Laravel自动gulp构建工具的布置文件,执行安装好gulp,即可使用gulp进行构建项目,非常方便。

  1. 拜出现

PHP 3

查看日志

PHP 4

拷贝.env文件又履行php artisan key:generate生成APP_KEY

  1. 默认laravel曾自带集成vuejs

PHP 5

属下去把这Example显示在页面及

于welcome.blade.php加入以下代码

PHP 6

PHP 7

履行gulp自动构建编译代码

PHP 8

启动服务走访首页即可看到example组件

PHP 9

  1. 引入semantic-ui,在Example.vue加入semantic对应的class

PHP 10

在首页也引入semantic.css

看后的效能使图

PHP 11

交者一个概括的Laravel+VueJS+Semantic-UI的三合一开发条件搭建成功了,有趣味的情人可以尝试


wxgzh:ludong86

PHP 12

相关文章