Geek Answers Handbook

Gulp -rev-replace does not change the names of changed files in my master.blade.php

I am trying to create a build system using gulp in a Laravel project, and the only problem left now is to rename the correct file names inside my file master.blade.php. As now, this happens only after the file names provided in the parameters , but the files, a href = "https://github.com/sindresorhus/gulp-rev" rel = "nofollow"> are not replaced . gulp-useref gulp-rev gulp-rev-replace

Here is my gulp task:

gulp.task('build', ['clean', 'scss', 'js', 'master'], function() {

    var assets,
        jsFilter        = $.filter('**/*.js'),
        cssFilter       = $.filter('**/*.css');

    return gulp.src('app/views/layouts/master.blade.php')
        .pipe(assets = $.useref.assets({searchPath: '/'}))

        .pipe(jsFilter)
        .pipe($.uglify())
        .pipe(jsFilter.restore())

        .pipe(cssFilter)
        .pipe($.csso())
        .pipe(cssFilter.restore())

        .pipe($.rev())
        .pipe(assets.restore())
        .pipe($.useref())
        .pipe($.revReplace())

        .pipe($.rename(function(path) {
            if(path.extname === '.php') {
                path.dirname = 'app/views/layouts';
            } else {
                path.dirname = 'public/assets';
            }
        }))

        .pipe(gulp.dest('./'))
        .pipe($.size({title: 'build files', showFiles: true}))

        .on('end', function() {
            setTimeout(function() {
                // force watchify to close all watchers
                process.exit();
            });
        });

});

The default value master.blade.phpwill look like this:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{$title}}</title>

    <!-- build:css assets/index.css -->
    <!-- bower:css -->
    <link rel="stylesheet" href="/bower_components/components-font-awesome/css/font-awesome.css" />
    <!-- endbower -->
    <link rel="stylesheet" href="/.tmp/index.css">
    <!-- endbuild -->
</head>
<body>

    <section id="container">
        <header>
            @include('layouts.navbar')
        </header>
        <aside>
            @include('layouts.sidebar')
        </aside>
        <section>
            @yield('content')
        </section>
        <footer>
            @include('layouts.footer')
        </footer>
    </section>

    <!-- build:js assets/index.js -->
    <!-- bower:js -->
    <script src="/bower_components/jquery/dist/jquery.js"></script>
    <script src="/bower_components/lodash/dist/lodash.compat.js"></script>
    <!-- endbower -->
    <script src="/.tmp/index.js"></script>
    <!-- endbuild -->

</body>
</html>

and the result will always look like this despite the handset . gulp-rev-replace

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{$title}}</title>

    <link rel="stylesheet" href="assets/index.css">
</head>
<body>

    <section id="container">
        <header>
            @include('layouts.navbar')
        </header>
        <aside>
            @include('layouts.sidebar')
        </aside>
        <section>
            @yield('content')
        </section>
        <footer>
            @include('layouts.footer')
        </footer>
    </section>

    <script src="assets/index.js"></script>

</body>
</html>
+4
source share
1 answer

, gulp-rev-replace , ['.js', '.css', '.html', '.hbs']. ['.php'] replaceInExtensions.

+5

More articles:


All Articles