I read the documentation available for Laravel 5's new Elixir.
I have written this code and run gulp multiple times, however, the compiled/minified css and js are not coming in:
var elixir = require('laravel-elixir');
elixir(function(mix) {
mix
.styles([
"resources/assets/components/bootstrap/dist/css/bootstrap.css"
])
.scripts([
"resources/assets/components/jquery/dist/jquery.js"
])
.version('css/app.css');
});
I've run npm install
and gulp
in the CLI and I get this output (which seems normal):
[05:15:58] Starting 'default'...
[05:15:58] Starting 'styles'...
[05:16:00] Finished 'default' after 1.32 s
[05:16:00] Finished 'styles' after 1.32 s
[05:16:00] Starting 'scripts'...
[05:16:00] Finished 'scripts' after 456 ms
[05:16:00] Starting 'version'...
[05:16:00] Finished 'version' after 2.6 ms
vagrant@homestead:~/Code/fixer$
What's the problem here? I also watched the Laracast and it seems I'm doing everything properly.
It's difficult to find a good answer given this is new.
Elixir will assume that the stylesheets and scripts that you're concatenating are located in the public/ directory. To override that, set the base directory.
elixir(function(mix) {
mix
.styles([
"components/bootstrap/dist/css/bootstrap.css"
], "resources/assets")
.scripts([
"components/jquery/dist/jquery.js"
], "resources/assets")
.version('css/app.css');
});
(But also remember that you're trying to concatenate one file in each of those blocks... Maybe that was just for your code snippet.)
Check your package.json
file - I've been trying to fix this issue for myself this morning, and it turns out that Elixir is a little buggy at the moment.
I'd been trying to run multiple .scripts()
functions (one for head scripts, one for foot scripts) which didn't work until I found this post which said to update to version 0.4.x of Elixir. I did that, and suddenly the scripts seemed to be compiling.
Then they stopped appearing in /public/js
for no reason that I could find, and downgrading back to 0.3.* has made them come back.
My package.json
looks like this right now:
{
"devDependencies": {
"gulp": "^3.8.9",
"laravel-elixir": "^0.3.*"
}
}
I have the same problem.
Just started to debug this and so far I can tell that problem is caused by the fact that there is incorrect src variable passed to gulp-less from elixir:
[ 'undefined/resources/assets/less/site.less' ]
As you can see, it is prefixed by "undefined".
If one would pass correct path string into the function (in GulpCssCompiler), then it works fine.
return gulp.src('resources/assets/less/site.less')
.pipe(plugins[options.pluginName](options.pluginOptions))
I will look into this some more.
EDIT:
There seems to be an error in 'GulpCssCompiler.js' file.
Short fix:
Replace on line 11:
options.src, options.assetsDir, options.search
with:
options.src, config.assetsDir, options.search
and use 'less/file.less' in gulpfile (this presumes that resources/assets is the assetsdir)