Setting Up Node.js, Bower, Gulp on AWS Opsworks
In one of my PHP web application managed by AWS Opsworks, I still need to compile SASS files myself and commit all the compiled CSS files into Git before I want to deploy. That’s bad in my opinion as we store both source files which is SASS and its product which is compiled CSS files under the version control. So, in order to eliminate all the CSS files, I need to set up my servers to have Node.JS, Bower, and Gulp to be able to compile them, and as I stated that I’m using Opsworks to manage this application, so the steps would be:
- Install Node.js and NPM
- Run Gulp
Installing Node.js and NPM
One way to do if you don’t use the scaling option is to ssh into the server and run:
|
1 2 |
curl -sL https://deb.nodesource.com/setup_5.x | sudo -E bash - sudo apt-get install -y nodejs |
However, if the auto-scaling is one of the requirement, we need to add a recipe for that. So, go to Layers page and click Recipes under PHP App Server
And, add
opsworks_nodejs into the Setup phase under Custom Chef Recipes section.
https://github.com/aws/opsworks-cookbooks/blob/release-chef-11.10/opsworks_nodejs/recipes/default.rb
After, you’ve added this into your custom recipe. Don’t forget to run Update Custom Cookbooks command since normally, all recipes are cached in the instance; otherwise, Chef will complain you that the recipe is not found.
One thing to be noted though, as the recipe is managed by AWS, the version you will get might not be the latest one. The version I got wass Node.js v0.12.9 and NPM 2.14.9. So, if you really need a newer version, you will need to create your own recipe for that.
Running Gulp
With this project, I use Gulp and Bower, so I need to add a dependency into package.json
|
1 2 3 4 5 6 7 8 9 10 |
{ "private": true, "devDependencies": { "gulp": "^3.8.8" }, "dependencies": { "bower": "^1.7.2", "laravel-elixir": "^4.0.0" } } |
And, finally, we can run Gulp by using Chef Deployment Hooks (http://docs.aws.amazon.com/opsworks/latest/userguide/workingcookbook-extend-hooks.html). I want all the assets compilation to be finished before the Symlink stage is complete, so I put the command into deploy/before_restart.rb.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
execute "Running npm install" do cwd release_path user "deploy" group "www-data" command "npm install" returns [0, ''] end execute "Rebuild node-sass" do cwd release_path user "deploy" group "www-data" command "npm rebuild node-sass" end execute "Run bower install" do cwd release_path user "deploy" group "www-data" command "./node_modules/.bin/bower install" end execute "Compile assets" do cwd release_path user "deploy" group "www-data" command "./node_modules/.bin/gulp" end |
After that, I tried to deploy the app, but I got the error:
|
1 2 3 |
Mixlib::ShellOut::ShellCommandFailed ------------------------------------ Expected process to exit with [0], but received '' |
That was because for some reasons, npm install returns ''(empty string) when the process is done, so I need to override the return value in line 6. Besides, for npm rebuild node-sass in line 8, I put it there just to make sure we won’t get the error libsass bindings not found. (http://stackoverflow.com/questions/16975299/override-the-chef-bash-return-code)
After following all the steps above, you can verify the result by trying to add a new instance and deploy your app again. You can check whether the website is still running properly, and maybe, check under the browser console that there is no errors shown about assets missing.
That’s it. Pretty easy and simple, yeh?
If you need any help or have any questions, please let me know I’m very happy to discuss on it.
Next Post
