Search code examples
phplaravelgulplaravel-5laravel-elixir

Compiling assets subdirectories in Gulp with Laravel Elixir

I am working on what will end up being a very large application, which means my asssets/whatever folders are going to contain possibly a few hundred files (SCSS, js etc).

Obviously this will make managing them a little tricky, so I would like to arrange them into subfolders for each module of my application.

e.g. The SAP part of my application would have its style and js stored like the following:

resources/assets/js/SAP/myjs.js resources/assets/sass/SAP/mysass.scss

It looks like in laravel-elixars config that you can only specify one assetsDir path:

var config = {
    production: !! util.env.production,
    srcDir: 'app',
    assetsDir: 'resources/assets/',
    cssOutput: 'public/css/_raw',
    jsOutput: 'public/js/_raw',
    bowerDir: 'vendor/bower_components',
    tasks: [],
    watchers: { default: {} },
    duplicate: [],
    concatenate: { css: [], js: [] }
};

It would be good if you could at least do the following:

...
assetsDir: ['resources/assets/SAP', 'resources/assets/Diary', ...],
...

Or even better, have it automatically map the paths for output based on the directories in the assets directory.

Solution

  • Found a solution to my question.

    For the css part of it I can use SASS's @import in a master.scss file which just @imports all the scss files for various bits of my project.

    I guess for the JS I would do something similar with requirejs(?).