Using Laravel Elixir in a Cordova Phone App

I regularly use the awesome framework, Laravel, at work and building my hobbyist projects in my spare time. Any coder that uses Laravel should know about Laravel Elixir and how it makes using Gulp so, so, so much easier. For those who don’t know it basically converts about 30 lines of code into 1 line and when you’re writing 1000’s of lines of code every week this can be a huge time saver.

This week, I’ve been using my 10% innovation time to see if I can port the Laravel Elixir package over to the phone apps I’ve been working on. I use a Cordova framework called Ionic which is based on the AngularJS framework. So it makes sense to use a nice Gulp manager to help ease my workflow. Why not make it even easier?

I didn’t really face any issues while doing this. Because Laravel Elixir is a Node package it’s pretty easy to just add the package to your package.json file and perform an “npm update.” Once it’s in you then just need to copy the structure from your Laravel project’s Gulp file over to your phone’s Gulp file then update your directory paths. Because Laravel Elixir takes files from resouces/assets and sticks them in the public folder you need to make sure it fits whatever your directory structure is on the app.

Overall it’s been pretty successful with a couple of bugs along the way. Because it was so easy to do, I decided to go one step further and copy the way that the LaravelAngular framework manages it’s AngularJS files.

LaravelAngular is a Laravel/AngularJS hybrid (if you haven’t already guessed). It stores all the AngularJS files in the angular root directory and automatically works out which files to import and copy over to your public folder. To port this over I literally just copied the preset Gulp tasks from the framework and put them in my phone apps root directory then changed the directory paths like I did with Laravel Elixir.

Now, pretty much all I have to do when I load up my project is type in “gulp watch” and everything just compiles and minifies automatically and extremely quickly! No more managing lines and lines of Gulp tasks. Why would a coder need to code that much anyway, right?