TLDR; Things got messed up when I went into production with my webpack installed Rails 6 codebase. I solved the case and learned a few new things along the way that I share below.
This -> 🌝
This is the face of a man who solved several problems that he faced in moving Rails 6 webpack into the production environment, yet hated every minute working on it.
Why do we lack a simple documentation on this procedure?
While the primary goal of developing a website is to deploy it, how come I cannot push my website to the public simply using webpacker. Furthermore, why one earth there is not any warnings.
No, probably there is documentation on going to production with webpack and Rails 6. The main reason is that Rails documentation pages still include lots of legacy resources from Rails 5.X releases, and it is hard to find one for Rail 6. Guess what, that is the documentation. 🌝
It is simple. I want to go to production and serve my packs and assets from Rails.
I know it is not a good choice for production. But I want to first, set my environment; second, make sure it is working; and finally, go backend and install
apacheor any other server that serves assets.
The problem is getting several errors on the way. Now, let's go through errors one by one, and solve our problems to production.
Yarn.lock file tells the system which yarn packages are needed for your website to work and what are their dependencies. But, when you work on your MAC or PC and develop your system there, and go to production with a Linux server, sometimes you get inconsistent yarn.lock file, because your systems are different.
Usually, you should push your yarn.lock file to your repo and use it on production. But if you are a lucky one like me, you can get the following message:
rails server -e production ERROR: The engine "node" is incompatible with this module. Expected version ">=8.16.0". Got "8.10.0"
You are getting this error because your node installations on your dev and production environments are different. You can always update your dev environment to be in sync with your production. I think this should be the best solution. To do that;
yarn install --ignore-engines
This step updates your yarn.lock file for your production environment. Then, you can push it to your repo and use it from your dev environment. 👍
You can also update your node to a newer version, but this can break other things in production with a node dependency. So, be careful.
curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash - sudo apt-get install -y nodejs
A better option would be to go with different yarn.lock files and yarn installation for production and development if you know what you are doing 😄. Unfortunately, that was not the case for me.
If you decide to go with two different yarn files, go to your webpacker.yml file and change the following line so that you should not get an error every time.
check_yarn_integrity: true to check_yarn_integrity: false
When you can run
rails server -e production successfully but you get;
Blocked host: turrsu.com To allow requests to turrsu.com, add the following to your environment configuration: config.hosts << "turrsu.com"
This is a feature that comes with Rails 6. You need to define hosts for the app to work. So you go
config/environments/production.rb file and add your host.
config.hosts << "www.turrsu.com"
and also you need to go to your
development.rb file and add this
config.hosts = nil
and if you have dynamic URLs, you can use regex here like this
config.hosts << /[a-z0-9]+\.turrsu\.com/
As long as you have
apache installed as a server, they serve your assets, and you don't need to do anything. However, if you want to serve your assets from Puma and Rails, you have to do this.
Go to your config/environments/production.rb file and change the following line.
config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present? to config.public_file_server.enabled = true
This serves your assets from your Puma/Rails.
This usually happens because of two reasons. You either didn't set your bin/webpack for production, or you didn't compile your assets for production. Let's go one by one.
To compile your packs, you do for your app.
But it doesn't do it for production because in default, it's set for the development environment, and you need to change that in production.
Go your bin/webpack from your production env.
Change these lines
ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development" ENV["NODE_ENV"] ||= "development"
ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "production" ENV["NODE_ENV"] ||= "production"
NODE_ENV environment variables to production.
Now, when you do bin/webpack this compile your packs for production.
In Rails, you need to compile your assets to serve them. Compile doesn't always re-write your files. Sometimes you get this error:
Webpacker can't find application in /Users/tcgumus/Documents/rails/pikseladam-with-ror/public/packs/manifest.json. Possible causes: 1. You want to set webpacker.yml value of compile to true for your environment unless you are using the `webpack -w` or the webpack-dev-server. 2. webpack has not yet re-run to reflect updates. 3. You have misconfigured Webpacker's config/webpacker.yml file. 4. Your webpack configuration is not creating a manifest.
To make it a clean and straightforward compile job, you need to delete
RAILS_ENV=production rake assets:precompile bin/webpack
or if you didn't update your
bin/webpack file, you do this
RAILS_ENV=production rake assets:precompile RAILS_ENV=production RACK_ENV=production NODE_ENV=production bin/webpack
After this, I was able to run my app from my Puma/Rails and access my assets from it. This article solves some problems you will face when you go to production with Rails 6 and webpack, but I'm pretty sure this is just a beginning.
Defining a production environment is a tough job. It includes lots of decisions to make, and it changes quickly when requirements change, when developers change. I wish this article will help some of you, but please consider that it includes my decisions for my production environment right now. It can change through time and space. This is still a work in progress. 👨💻
Please let me know if I can help.