脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → PHP编程 → php实例 → Laravel用gulp构建前端资源

Laravel利用gulp如何构建前端资源详解

 更新时间：2018年06月03日 08:43:29   作者：小谈  
Gulp 是一个自动化工具，前端开发者可以使用它来处理常见任务，下面这篇文章主要给大家介绍了关于Laravel利用gulp如何构建前端资源的相关资料，文中通过示例代码介绍的非常详细，需要的朋友可以参考借鉴，下面来一起看看吧

什么是gulp？

gulp是新一代的前端项目构建工具，你可以使用gulp及其插件对你的项目代码（less,sass）进行编译，还可以压缩你的js和css代码，甚至压缩你的图片，gulp仅有少量的API，所以非常容易学习。 gulp 使用 stream 方式处理内容。Node催生了一批自动化工具，像Bower，Yeoman，Grunt等。

gulp和grunt的异同点

易于使用：采用代码优于配置策略，Gulp让简单的事情继续简单，复杂的任务变得可管理。

高效：通过利用Node.js强大的流，不需要往磁盘写中间文件，可以更快地完成构建。

高质量：Gulp严格的插件指导方针，确保插件简单并且按你期望的方式工作。

易于学习：通过把API降到最少，你能在很短的时间内学会Gulp。构建工作就像你设想的一样：是一系列流管道。

引言

最近把自己主页前端代码进一步规范了，使用 npm 引入一些前端的资源库，在 Laravel 5.5 中使用 gulp 遇到一些坑。

mix.sass 无法直接使用 node_modules 文件夹里的，只能用 resource/assets/sass/app.scss 这个文件生成 css，然后和其他的 css 合并为一个文件。

mix.scripts 可以使用 node_modules 文件夹里的 js，并和自己的 js 合并为一个文件。

mix.copy 可以复制 node_modules 中的文件到指定的目录，比如字体。

mix.version 可以给合并后的文件增加版本号。

贴出我最终的配置如下：

elixir(function (mix) {
 mix.sass([
  'app.scss'
 ], 'public/css')
  .styles([
   './public/css/app.css',
   'style.css',
   'pill.css',
  ], 'public/css/site.css')
  .styles([
   './public/css/app.css',
   'cover.css',
  ], 'public/css/cover.css')
  .scripts([
   './node_modules/jquery/dist/jquery.min.js',
   './node_modules/bootstrap-sass/assets/javascripts/bootstrap.min.js',
   'scrollerup.js'
  ],'public/js/app.js')
  .copy([
   './node_modules/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff',
   './node_modules/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff2'
  ], 'public/build/fonts/bootstrap')
  .version([
   'public/css/cover.css',
   'public/css/site.css'
  ]);
});

以上代码出自我的 gulpfile.js 文件。

运行 gulp 命令，线上运行 gulp –production.

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。

您可能感兴趣的文章:

相关文章

  • Laravel框架路由设置与使用示例

    Laravel框架路由设置与使用示例

    这篇文章主要介绍了Laravel框架路由设置与使用,结合实例形式分析了Laravel框架路由的设置方法、相关操作注意事项,需要的朋友可以参考下
    2018-06-06
  • uni-app结合PHP实现单用户登陆demo及解析

    uni-app结合PHP实现单用户登陆demo及解析

    这篇文章主要为大家介绍了uni-app结合PHP实现单用户登陆示例过程详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-05-05
  • 详谈PHP基础与JS操作的区别(必看篇)

    详谈PHP基础与JS操作的区别(必看篇)

    下面小编就为大家带来一篇详谈PHP基础与JS操作的区别(必看篇)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • PHP中__LINE__,__FILE__,__DIR__等常用魔术常量实例讲解

    PHP中__LINE__,__FILE__,__DIR__等常用魔术常量实例讲解

    PHP 向它运行的任何脚本提供了大量的预定义常量。魔术常量准确来说并不能算是常量，常量我们在之前的文章中我们介绍到，常量被定义之后是不能被改变的。但是魔术常量是PHP预定义的一些常量，这些预定义的常量能够因为所在位置的变化而变化。
    2022-12-12
  • php 判断IP为有效IP地址的方法

    php 判断IP为有效IP地址的方法

    这篇文章主要介绍了php 判断IP为有效IP地址的方法,需要的朋友可以参考下
    2018-01-01
  • 基于Zookeeper的使用详解

    基于Zookeeper的使用详解

    本篇文章介绍了，基于Zookeeper的使用说明，需要的朋友参考下
    2013-05-05
  • PHP读取PDF内容配合Xpdf的使用

    PHP读取PDF内容配合Xpdf的使用

    最近领导拍脑袋想出了一个需求，要我读取PDF里面的内容，并且入库存为正文，用来搜索,需要的朋友可以了解下
    2012-11-11
  • 让CodeIgniter的ellipsize()支持中文截断的方法

    让CodeIgniter的ellipsize()支持中文截断的方法

    CodeIgniter的Text Helper有一个ellipsize()方法，用来过滤HTML标签并且截断文字十分好用。但是它对中文支持的特别不好，在中文中使用就有乱码出现。这篇文章主要介绍了让CodeIgniter的ellipsize()支持中文截断的方法,需要的朋友可以参考下
    2014-06-06
  • Codeigniter框架实现获取分页数据和总条数的方法

    Codeigniter框架实现获取分页数据和总条数的方法

    这篇文章主要介绍了Codeigniter框架实现获取分页数据和总条数的方法,实现了对获取当前页的数据和总条数方法的封装,是非常实用的技巧,需要的朋友可以参考下
    2014-12-12
  • CI框架中redis缓存相关操作文件示例代码

    CI框架中redis缓存相关操作文件示例代码

    这篇文章主要介绍了CI框架中redis缓存相关操作文件,结合完整示例演示了CI框架redis缓存相关操作技巧,需要的朋友可以参考下
    2016-05-05

最新评论