使用 Elixir 为 Laravel 静态资源文件自动打上版本号

更新日期: 2016-09-13 阅读次数: 11027 分类: Laravel

问题的起因,发现微信 Android 的内置浏览器对静态资源文件做了缓存,无法自动刷新。于是手动给资源文件加上了时间戳,但是手动操作总是不靠谱的,于是决定采用自动化的方案 Laravel Elixir。

首先参照 安装 Laravel Elixir 将环境搭建好,然后就可以进行配置了。

自动更新版本

在 gulpfile.js 中加入

elixir(function(mix) {
    mix.version('css/all.css');
});

对应的在 blade 模板中使用

<link rel="stylesheet" href="{{ elixir('css/all.css') }}">

这时查看 HTML 就会看到

<link rel="stylesheet" href="/build/css/all-cc97bc6fb2.css">

应该是对文件做了 hash, 截取了前几位作为 version 标识。

public/build 目录是否要加入 git 管理

进行假设分析。

假设不加入 git 管理,那么打上 version 标签的文件默认在生产环境是看不到的,那么就需要在生产环境再部署一套 elixir 的环境。

好吧,我觉得这货不应该放到生产环境。

  • 配置复杂
  • 无法保障运维正确使用

还是老老实实放到 git 管理。

但是,git merge 就是个挑战了。不同版本的资源文件,会对应不同的 version 文件,理论上合并会导致两个 version 文件并存,而且不知道对应关系。

那么,只能在服务器上搭建 elixir 环境了,并且要将 public/build 目录加到 gitignore 列表中。

使用了 elixir 如何不影响开发环境的 debug

Adding the --production flag to the command will instruct Elixir to minify your CSS and JavaScript files

所以,在开发环境只需要运行

gulp

即可。并不会将 js 压缩,影响调试。

关于作者 🌱

我是来自山东烟台的一名开发者,有敢兴趣的话题,或者软件开发需求,欢迎加微信 zhongwei 聊聊, 查看更多联系方式