Heroku + Rails + Bower

1. Instale nodejs e npm

Eu gosto de usar nvm por creationix .

2. Instale o Bower

Certifique-se de instalar o Bower em seus módulos node_modules locais. Esta é uma prática recomendada incentivada pelo Heroku . Você deve adicionar node_modules ao controle de origem.

npm install bower

3. Usando .bowerrcdizer ao Bower para instalar todos os ativos em vendor/assets/components:

{
  "directory": "vendor/assets/components"
}

4. Em application.rbdiga ao Rails para adicionar vendor/assets/componentsao caminho de carregamento de pré-compilação:

config.assets.paths << Rails.root.join('vendor', 'assets', 'components')

5. Adicionado vendor/assets/componentsa.gitignore

6. Crie um bower.jsonarquivo e adicione suas dependências:

{
  "name": "my-project",
  "dependencies": {
    "bootstrap": "~> 3.0"
  }
}

7. Instale dependências usando o Bower:

bower install

8. Adicione suas dependências aos seus arquivos de manifesto de ativos do Rails:

// app/assets/javascripts/application.js
//
// ...
//= require bootstrap
// ...

/* app/assets/stylesheets/application.css
 *
 * ...
 *= require bootstrap
 * ...
*/

9. Registre as extensões para os arquivos que devem ser pré-compilados em :application.rb

# via https://gist.github.com/afeld/5704079

# We don't want the default of everything that isn't js or css, because it pulls too many things in
config.assets.precompile.shift

# Explicitly register the extensions we are interested in compiling
config.assets.precompile.push(Proc.new do |path|
  File.extname(path).in? [
    '.html', '.erb', '.haml',                 # Templates
    '.png',  '.gif', '.jpg', '.jpeg', '.svg', # Images
    '.eot',  '.otf', '.svc', '.woff', '.ttf', # Fonts
  ]
end)

Observe que geralmente retiro as extensões do modelo. Geralmente, eles compilam coisas que meu aplicativo não precisa das dependências de front-end. Cada um com sua mania.

10. Certifique-se de que seus ativos sejam pré-compilados localmente:

$ RAILS_ENV=production rake assets:precompile -v

11. Configure o Heroku para usar o multi-buildpack do ddollar :

$ heroku config:add BUILDPACK_URL=https://github.com/ddollar/heroku-buildpack-multi.git

12. Adicione o buildpack heroku-nodejs e o buildpack heroku-ruby a :.buildpacks

$ cat .buildpacks
https://github.com/heroku/heroku-buildpack-nodejs
https://github.com/heroku/heroku-buildpack-ruby

Certifique-se de que o buildpack ruby ​​seja o último da lista. Isso permitirá que você acesse o console do Rails durante a execução heroku run console.

13. Crie :package.json

{
  "name": "my-project",
  "version": "1.0.0",
  "dependencies": {
    "bower": "~1.2"
  },
  "engine": {
    "node": "0.10.x",
    "npm": "1.3.x"
  },
  "scripts": {
    "postinstall": "./node_modules/bower/bin/bower install"
  }
}

Observe que a dependenciesopção é onde você adicionará todas as dependências do nodejs. O Heroku será executado npm installna implantação.

Observe também o script postinstall. Isso dirá a Bower para retirar seus ativos. Isso é importante, caso contrário você não terá nada para compilar.rake assets:precompile

14. Empurre para Heroku

git push heroku master

15. Sente-se e maravilhe-se em como você nunca mais terá que gerenciar manualmente suas dependências de front-end.