版本控制将Laravel 5.4中的CSS文件与Laravel Mix相结合

Question

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

阅读它说的文档

版本方法将自动将唯一哈希附加到 所有已编译文件的文件名，允许更方便的缓存 破坏

它

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

实际上，我想将一些编译的文件与其他纯文件连接在一起，并将所有内容合并到一个版本控制文件中。

编辑：

我使用的代码如下所示

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

CSS 和 JS 文件的版本控制/缓存无效化

Webpack.Mix

将我的css(使用mix.styles(和js(使用mix.scripts(文件合并为两个文件后，我拥有了所有.css和所有.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').

边栏选项卡布局文件：

我创建了/css/all/和/js/all/目录。我使用 scandir(( php 函数进行排序来获取相应目录中的所有文件。然后我从数组中获得了第一个文件名，在本例中为"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();