版本控制将 Laravel 5.4 中的 CSS 个文件与 Laravel 混合

Question

我正在使用 Laravel Mix in Laravel 5.4，我想合并到普通文件并添加版本控制。

阅读它说的文档

The version method will automatically append a unique hash to the filenames of all compiled files, allowing for more convenient cache busting

它有效地做到了它所说的。但是是否有任何解决方法来获得带有版本控制的最终组合文件？

实际上，我想将一些已编译的文件与其他普通文件结合在一起，并将所有内容合并到一个版本化文件中。

编辑：

我使用的代码如下

mix.sass('resources/assets/sass/app.scss', 'public/css')
   .combine(['public/css/app.css', 'other/component/file.css'], 'public/css/all.css')
   .version();

我想获得一个版本化的 all.css 文件。即类似于 all.d41d8cd98f00b204e9800998ecf8427e.css。

但是我得到的是 app.css 的版本化版本和 all.css 的非版本化版本。

Answer 1

Versioning/Cache-Busting 对于 CSS 和 JS 文件

Webpack.Mix

将我的 css（使用 mix.styles）和 js（使用 mix.scripts）文件合并为两个文件后，我有 all.css 和 all.js。

要添加版本控制，我执行了以下操作：

var timestamp = Date.now();
mix.copy('public/css/all.css', 'public/css/all/all.'+ timestamp + '.css');
mix.copy('public/js/all.js', 'public/js/all/all.'+ timestamp + '.js');

或

合并你的css和js文件的时候直接写，例如：

mix.styles([
    'public/css/app.css',
    'public/css/custom.css'], 'public/css/all/all.'+ Date.now() + '.css').

mix.scripts([
    'public/js/app.js',
    'public/js/custom.js'], 'public/js/all/all.'+ Date.now() + '.js').

Blade布局文件：

我创建了 /css/all/ 和 /js/all/ 目录。我使用 scandir() php function 命令来获取相应目录中的所有文件。然后我从数组中得到第一个文件名，在这个例子中是 'all.1574160664960.css'.

@php($css_files = scandir('css/all/', 1))
<link href="/css/all/{{ $css_files[0] }}" rel="stylesheet">

@php($js_files = scandir('js/all/', 1))
<script src="/js/all/{{ $js_files[0] }}"></script>

Answer 2

https://laravel-mix.com/docs/5.0/versioning

在webpack.mix.js中：

const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.sass', 'public/css')
   .version();

版本控制将 Laravel 5.4 中的 CSS 个文件与 Laravel 混合

Versioning combined CSS files in Laravel 5.4 with Laravel Mix

laravel

laravel-mix