Support the ongoing development of Laravel.io →
posted 10 years ago
Views Blade
Last updated 2 years ago.
0

This is how I do it

config = 
    production: true
   
#Task definitions here

gulp.task 'set-development', -> config.production = false

gulp.task 'watch', ->
    gulp.watch 'src/coffee/**/*.coffee', ['set-development', 'coffee']
    gulp.watch 'src/less/**/*.less', ['set-development', 'less']
    gulp.watch 'src/bootstrap/**/*', ['dev']

gulp.task 'dev', ['set-development', 'default']

gulp.task 'default', ['less', 'bootstrap-js', 'coffee']

So I only use grunt watch or grunt dev in development but calling grunt by itself will build production

Then in the task itself I'll refer to config.produciton


gulp.task 'coffee', ->
    gulp.src 'src/coffee/app.coffee', read: false
        .pipe browserify(
            transform: ['coffeeify'] 
            extensions: ['.coffee']
            debug: not config.production
        )
        .pipe rename('app.js')
        .pipe gulp.dest('./assets/js')
        .pipe notify(message: 'app.coffee -> app.js: Complete')
Last updated 2 years ago.
0

And how do you include those files in your layout?

Is it better to include all assets in the layout or only the ones you really need for that view?

Last updated 2 years ago.
0

I would like to know that too mabasic. But I guess if you cache all your assets, there is no real difference?

I also have one related question, maybe someone knows what response header I am missing. There is headers of my css files.

Accept-Ranges:bytes
Cache-Control:max-age=2592000, public
Connection:Keep-Alive, close
Content-Encoding:gzip
Content-Type:text/css
Date:Fri, 04 Apr 2014 16:54:39 GMT
Expires:Sat, 04 Apr 2015 16:54:39 GMT
Last-Modified:Mon, 03 Mar 2014 23:23:37 GMT
Pragma:Cache
Server:Apache
Transfer-Encoding:chunked
Vary:Accept-Encoding,User-Agent

And still my css files are not being loaded from browser cache, but browser makes request to the server and gets response with status 304 - Not Modified...

Last updated 2 years ago.
0

mabasic said:

And how do you include those files in your layout?

Is it better to include all assets in the layout or only the ones you really need for that view?

//views/layouts/master.blade.php
@section('styles')
  {{ HTML::style('css/app.css') }}
@show

@section('scripts')
  {{ HTML::script('js/app.js') }}
@show

if you need to add more specific stylesheets or scripts, like the example of a page specific widget just extend the section in your view

//views/page_with_widget/index.blade.php
@section('scripts')
  @ parent
  {{ HTML::script('js/heavy_widget.js') }}
@stop

Theres always the issue of cache busting with bundled assets like these. The simplest solution would be to put the files md5 in a config. I'm sure theres an elegant way to automate it but simplest solution would be to md5sum filename and copy it into a config and add that to your view.

//views/layouts/master.blade.php
@section('styles')
  {{ HTML::style("css/app.css?v=" . Config::get('assets.style_app_md5') ) }}
@show

@section('scripts')
  {{ HTML::script("js/app.js?v=" . Config::get('assets.script_app_md5')) }}
@show
Last updated 2 years ago.
0

Here is my gulp file: https://github.com/that0n3guy/gulpfile-laravel

Here is one way to add them:

<head>

    <title>
        @yield('title')
    </title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    @yield('metatags')
    {{ HTML::style('build/bootstrap/stylesheets/bootstrap.css') }}
    {{ HTML::style('build/css/app.css') }}

    @yield('css')
    @yield('head')

    {{ HTML::script('build/js/appheader.js') }}

</head>

and footer:

{{ HTML::script('build/bootstrap/javascripts/bootstrap.js') }}
{{ HTML::script('build/js/appfooter.js') }}
Last updated 2 years ago.
0

Sign in to participate in this thread!

Eventy

Your banner here too?

mabasic mabasic Joined 3 Feb 2014

Moderators

We'd like to thank these amazing companies for supporting us

Your logo here?

Laravel.io

The Laravel portal for problem solving, knowledge sharing and community building.

© 2024 Laravel.io - All rights reserved.