How to setup Gruntfile to use compass/sass on heroku? - node.js

I've successfully set up my heroku app with the grunt buildpack. When I push my Node.js app to heroku it will run the appropriate grunt task.
What I'd like is to use the 'grunt-contrib-compass' package to compile my .scss files. But that requires the compass executable and I don't know how to get that.
I've checked the heroku documentation and have seen an outdated doc that describes setting up compass with ruby... but I haven't seen any recent documentation for setting it up with Node.js.
Any ideas?

This took a lot of figuring out, but I've finally managed to get it to work. What's needed is to get Ruby to install alongside your Node.js app, so you can install the appropriate gems. This gist was very helpful and more-or-less describes what I needed to do.
In summary, the process was:
Create the files .buildpacks, Gemfile, and Gemfile.lock in the project directory, with the following contents:
.buildpacks
https://github.com/heroku/heroku-buildpack-ruby.git
https://github.com/heroku/heroku-buildpack-nodejs.git
Gemfile
source "http://rubygems.org"
gem "sass"
Gemfile.lock
GEM
remote: http://rubygems.org/
specs:
sass (3.4.5)
PLATFORMS
ruby
DEPENDENCIES
sass
nb. I'm only using Sass, not Compass, but I'm guessing all you'll need to do to get compass is just add gem "compass" to the Gemfile and, eg. compass (1.0.3) below sass in the Gemfile.lock.
Add a multi buildpack to your app:
heroku config:add BUILDPACK_URL=https://github.com/ddollar/heroku-buildpack-multi.git
Finally, push these out to Heroku, and Ruby and Sass should install alongside your Node.js app, allowing you to use sass-related grunt tasks.

There is a forked-fork that includes compass installation. That might help:
https://github.com/stephanmelzer/heroku-buildpack-nodejs-grunt-compass

I got my app working on heroku using grunt-sass instead of grunt-contrib-sass. To swap them out just do npm install --save grunt-sass and then swap out the grunt-task wherever it's used (e.g.
grunt.loadNpmTasks('grunt-sass') instead of grunt.loadNpmTasks('grunt-contrib-sass')

Related

Meteor: Cannot find module 'angular'

I'm newbie on Meteor.
After one week on it, and started by implementing the todo of the tutorial as describe here, every things was good locally.
just the fact that I'm continually trying to deploy it, but my heroku
link(https://tasktor.herokuapp.com) just show a blank page with
the this error in de debugger:
Error: angular#^1.2.27 not installed. tmeasday_check-npm-versions.js:66:11
Error: Cannot find module 'angular'
Note that everything is clean on http://localhost:3000.
Already try a lot of solutions, as:
meteor add angular
meteor npm install --save angular
Disable minification of Js and Css.
This is the repository of this app deployed to heroku: https://github.com/dassiorleando/tasktor
his buildpack: https://github.com/dassiorleando/heroku-buildpack-meteor,
it is a buildpack with an updated Node Engine(4.5.0), that allowed to run an app with the meteor 1.4.X version.
Knowing that I add Angular-Material after finish this tutorial, because I wanted to have a clean material design style on my todo. You can check the repository to look about.
How can I handle this situation ?
Thanks in advance.
Doing this:
meteor add angular
Adds an old atmosphere angular-meteor package, which also refers to an old (1.2.27) version of angular. The best way to proceed is to remove this and just use angular npm packages. You will need these packages
pbastowski:angular-babel
urigo:static-templates
dotansimha:accounts-ui-angular
The last one is if you are using the accounts package.
The tutorial at https://www.angular-meteor.com/tutorials/socially/angular1/bootstrapping recommends this:
So let's remove it by running:
$ meteor remove blaze-html-templates
$ meteor remove ecmascript
Now let's add the Angular 1 package to Meteor, back in the command
line, launch this command:
$ meteor npm install --save angular angular-meteor babel-runtime
$ meteor add angular-templates pbastowski:angular-babel
That's it! Now we can use Angular 1's power in our Meteor app.

Yeoman dependencies for AngularJS project

Using Yeoman and the AngularJS generator I could previously follow their tutorial and install all the necessary packages and tools (bower, gulp, grunt,...) to get up and running. Per their website:
npm install -g yo bower grunt-cli gulp
then added the angularJS project 'generator':
npm install -g generator-angular
created a folder locally, and run
yo angular
in that folder in order to prepare a sample AngularJS project with all the necessary tools and scaffolding generated by Yeoman.
The command:
grunt serve
Launched the sample application successfully, allowing me to start learning about AngularJS (which I'm very new to).
The problem: I have repeated these steps again, (3 months later), and, admittedly, I have potentially taken on updates to some of the installed packages.
Now, when I create a new project and invoke 'grunt serve' I get:
Running "concurrent:server" (concurrent) task
Warning: Running "compass:server" (compass) task
Warning: Command failed: C:\Windows\system32\cmd.exe /s /c "compass.bat --versio
n"
'compass.bat' is not recognized as an internal or external command,
operable program or batch file.
Use --force to continue.
Aborted due to warnings.
and the site does not launch...
Researching this problem, some responses say that I now need to install yet another tool - Ruby, followed by the 'compass' gem.
Is this really necessary ?? (I'm hesitant because the Yeoman website does not require this to get started using the angular generator).
Is there perhaps another solution ?
thanks
It seems like compass is necessary by default.
It also seems that the only solution here is to go ahead and download Ruby (if you do not already have it), in order to install compass. These instructions cover how:
Download Ruby here: http://rubyinstaller.org/downloads/ and install.
Install the compass library: gem install compass
Yes compass is necessary.
Download and install ruby http://rubyinstaller.org/downloads/
and run gem install compass in ruby command prompt to install compass.
now it will work!!!.

Exiftool in nodejs for heroku

I have the problem that I need to use the exiftool, since I could command more metadata packages that are in NPM. But this program is not loaded in heroku, What is the method to install this command?
To get extra binaries, dependencies, libs, etc onto the dyno, you should specify additional buildpacks as documented here:
https://github.com/benalavi/buildpack-exiftool
The gist is:
heroku buildpack:set https://github.com/heroku/heroku-buildpack-multi
Then in .buildpacks:
https://github.com/benalavi/buildpack-exiftool
https://github.com/heroku/heroku-buildpack-nodejs
That will first download & install exiftool, then install node and use node (the final item listed) as your app buildpack.

How to check out a JHipster project in multiple development environments

I'm evaluating JHipster; it looks great for rapid development!
Maybe a novice question: I see that the generated .gitignore ignores certain things, e.g.
/node/**
/node_modules/**
So, if I check in the generated project to a repository, and then some other developer in my team checks it out in his environment, the project would not work in his environment. Would it?
Was curious to know how to handle this. Thanks.
Since your git repo won't track node packages, others using your git repo will need install node.js, then run npm install to download all the node packages.
It's similar to them having to have java and maven installed on their environment.
Update: A developer will run 'git clone '. The source (not including node or bower) will be on their workstation. Once they've installed node.js, they'll run 'npm install' and the node directories will be created automatically for your project by downloading them from the Internet. That way you don't need to keep all your node libraries in your own git repository ...just their package name and version in the package.json file (similar to maven dependencies in pom.xml).
No one should commit the node_modules or bower_components to git, what you would do is share the project like you share the maven projects.
Write in the read me what needs to be done to get them ready, for example the installation of yo, bower, grunt or gulp and generator-jhipster.
What is very nice about liquibase, each developer can have his own version of the database, and every commit has its own database version.
What we our team does, if a developer adds something to node js package.json then we mention it in the comment: npm install needed and the same applies for bower.
That way you keep all your environments clean, and if you would like to install continuous integration like "Jenkins or Teamcity" then you make sure Jenkins is building rebuilding the whole project.

Avoid npm refresh after every deployment on Heroku

I have a Node.js website hosted on Heroku, that I deploy with git.
I use several node modules, referenced in package.json; is there a way to prevent Heroku to 'refresh' them each time I deploy a new version of the code, as long as package.json did not change?
Note: this would be especially useful for 'native' modules, whose compilation takes a bit of time; for .js-only modules, I was successful removing them from package.json, and adding their node_modules/ folder in the git repo.
I'm the maintainer of the official Heroku Node.js Buildpack.
We have a new version of the buildpack in beta that features caching support, designed specifically for the use case you described above. You can read more about it at https://github.com/heroku/heroku-buildpack-nodejs/tree/diet#about-this-refactor
Eventually this will become the default Node.js buildpack on Heroku, but if you want to use it now you'll need to set the BUILPACK_URL config var explicitly:
heroku config:set BUILDPACK_URL=https://github.com/heroku/heroku-buildpack-nodejs#diet -a my-node-app
git commit -am "fakeout" --allow-empty
git push heroku
Seems like there has recently been progress by David Dollar at the heroku-buildpack-nodejs.
In short:
heroku config:set BUILDPACK_URL=https://github.com/ddollar/heroku-buildpack-nodejs
See answer here:
https://stackoverflow.com/a/18535675/1318839
You can add both .js and native npm packages and still avoid the "refresh", (at least the re-downloading part of the "refresh".)
Include the native packages to your node_modules/ directory. When you deploy to Heroku, npm install will skip the downloading of the package. npm rebuild is also run. It will take some time to re-compile the native packages, but it should be very bearable unless you have tons of native packages.
Sidenote: Heroku doc on what Heroku does when you push a nodejs app.
Sidenote: The npm rebuild is needed because there "are mysterious failures that can happen between node and native code modules after a node upgrade".
Clone the Heroku node.js buildpack, and modify it to remove the rebuild command.
The command is currently run here:
https://github.com/heroku/heroku-buildpack-nodejs/blob/master/bin/compile#L180 , but that's bound to change.
You can run create an app that uses your own buildpack by modifying the command below to match your own repo:
heroku create --buildpack http://github.com/heroku/heroku-buildpack-nodejs.git
Or change the buildpack of an existing app with:
heroku config:add BUILDPACK_URL=git://github.com/heroku/heroku-buildpack-nodejs.git

Resources