Asset Compilation w/ Laravel Envoyer
The Problem(s)
- Running
gulp --production
before deployment is tedious and often forgotten, especialy when you are running gulp watch and assets are being compiled after any change.
- Running
npm install
on a server during every deployment and compiling it after is slow.
- Compiling locally and committing your versioned assets doesn't allow you to make tiny commits unless you leave out the versioned file until you are done.
- Using Envoyer for zero-downtime deployments doesn't handle this for you.
The Solution
Using Envoyer's deployment hooks we can fix the problems so that our assets are compiled when the project is deployed. We can also eliminate how long it takes NPM to download all of the packages we need by storing them in a shared node_modules folder.
Below are the steps required to download your node dependencies and compile your assets during deployment.
Performance
After the deployment hook runs for the first time, the deployment time drastically decreases. This is because we need to download all the node packages during the first deployment and then from there we symlink the project's node_modules directory to the release's node_modules directory.
- Running NPM install and gulp on server w/out symlinks (see example below): 4 min
- Using .envoyer deployment hook (first deployment): 2 min
- Using .envoyer deployment hook (after first deployment): 55s
Example w/out symlinks
Using one deployment hook containing:
npm install
gulp --production
Usage
- Login to your envoyer.io account and go to your projects deployment screen.
- Click "Deployment Hooks" tab
- Click cog wheel icon/button on the "Activate New Release" hook
- In the "Before This Action" panel click add hook
- Add a hook name
- Add the user to run the hook as (default: forge)
- Copy and paste the .envoyer file into the editor*
The Psuedo-Code Steps
- Go to the release directory
- Copy the package.json file to the projects directory
- Go to the project directory
- Run
npm install
- Run
npm update
- Symlink the {{project}}/node_modules directory to the {{release}}/node_modules directory
- Go to the release directory
- Run gulp
My Hooks*
I broke down the steps into 5 different hooks so I could see how long certain steps were taking. The hooks names are listed below.
- Copy package.json
- Install node packages
- Update node packages
- Create node_modules symlink
- Compile assets