CODEWITHSUNDEEP
ruby-on-railsamazon-ec2capistranoweb-deployment
Lunik
Lunik

Reputation: 103

rails precompiled assets in public/packs not being served in production on ec2 instance

I'm deploying a rails 6 application with webpacker on AWS ec2 instance with Nginx, using Capistrano. The first time i deployed the app in production i did so without precompiling assets locally and took too long and finally worked. But as my application becomes larger with many css, js and other assets to compile i went on precompiling locally using RAILS_ENV=production bundle exec rails assets:precompile. Then i deployed to production with SKIP_ASSETS=1 cap production deploy where SKIP_ASSETS is a rake task in capistrano/task folder. I was able to deploy the app faster without assets being compiled on production server. When i refresh the brower, i can see my app but the assets precompiled in the folder public/packs are not being served (the hash of the .css and .js file do not match that in public/packs.

I get the following error when i look at the browser console

GET https://somedomain.net/packs/css/application-e1eaaa01.css net::ERR_ABORTED 404 (Not Found)
GET https://somedomain.net/packs/js/application-a89fd481878017456cf7.js net::ERR_ABORTED 404 (Not Found)

this is what i see in production in public/packs/css/ 

application-91e4cb67.css  application-91e4cb67.css.br  application-91e4cb67.css.gz

Looking at the log in production i found this

FATAL -- : [2c61c3a9-0133-4eda-b37b-4fefe8948ec0]   
[2c61c3a9-0133-4eda-b37b-4fefe8948ec0] ActionController::RoutingError (No route matches [GET] "/packs/js/application-a89fd481878017456cf7.js"):

Looking at nginx.conf i have this line

root /home/deploy/myapp/current/public

I also tried setting this in production.rb but it did'nt solve the problem

config.public_file_server.enabled=true

public/packs/manifest.json looks like this:

{
  "admin.js": "/packs/js/admin-3adbcf597c3892508a80.js",
  "admin.js.map": "/packs/js/admin-3adbcf597c3892508a80.js.map",
  "app.js": "/packs/js/app-aedc421c2c4342e69b23.js",
  "app.js.map": "/packs/js/app-aedc421c2c4342e69b23.js.map",
  "application.css": "/packs/css/application-e1eaaa01.css",
  "application.css.map": "/packs/css/application-e1eaaa01.css.map",
  "application.js": "/packs/js/application-a89fd481878017456cf7.js",
  "application.js.map": "/packs/js/application-a89fd481878017456cf7.js.map",
  "curriculum.js": "/packs/js/curriculum-90932b11d8e738537011.js",
  "curriculum.js.map": "/packs/js/curriculum-90932b11d8e738537011.js.map",
  "entrypoints": {
    "admin": {
      "js": [
        "/packs/js/admin-3adbcf597c3892508a80.js"
      ],
      "js.map": [
        "/packs/js/admin-3adbcf597c3892508a80.js.map"
      ]
    },
    "app": {
      "js": [
        "/packs/js/app-aedc421c2c4342e69b23.js"
      ],
      "js.map": [
        "/packs/js/app-aedc421c2c4342e69b23.js.map"
      ]
    },
    "application": {
      "css": [
        "/packs/css/application-e1eaaa01.css"
      ],
      "js": [
        "/packs/js/application-a89fd481878017456cf7.js"
      ],
      "css.map": [
        "/packs/css/application-e1eaaa01.css.map"
      ],
      "js.map": [
        "/packs/js/application-a89fd481878017456cf7.js.map"
      ]
    },
    "curriculum": {
      "js": [
        "/packs/js/curriculum-90932b11d8e738537011.js"
      ],
      "js.map": [
        "/packs/js/curriculum-90932b11d8e738537011.js.map"
      ]
    },
    "jquery-ui": {
      "js": [
        "/packs/js/jquery-ui-3e39ba39480cd149114d.js"
      ],
      "js.map": [
        "/packs/js/jquery-ui-3e39ba39480cd149114d.js.map"
      ]
    },
    "jquery": {
      "js": [
        "/packs/js/jquery-9e6aaa895e0224ac507d.js"
      ],
      "js.map": [
        "/packs/js/jquery-9e6aaa895e0224ac507d.js.map"
      ]
    },
    "quill_editor": {
      "js": [
        "/packs/js/quill_editor-9b402f092ddc5d16a887.js"
      ],
      "js.map": [
        "/packs/js/quill_editor-9b402f092ddc5d16a887.js.map"
      ]
    },
    "shared_javascript": {
      "js": [
        "/packs/js/shared_javascript-f0cae6e551b8cfc573c9.js"
      ],
      "js.map": [
        "/packs/js/shared_javascript-f0cae6e551b8cfc573c9.js.map"
      ]
    },
    "video_player": {
      "js": [
        "/packs/js/video_player-8b5df237b6fc7da9efea.js"
      ],
      "js.map": [
        "/packs/js/video_player-8b5df237b6fc7da9efea.js.map"
      ]
    }
  },
  "jquery-ui.js": "/packs/js/jquery-ui-3e39ba39480cd149114d.js",
  "jquery-ui.js.map": "/packs/js/jquery-ui-3e39ba39480cd149114d.js.map",
  "jquery.js": "/packs/js/jquery-9e6aaa895e0224ac507d.js",
  "jquery.js.map": "/packs/js/jquery-9e6aaa895e0224ac507d.js.map",
  "quill_editor.js": "/packs/js/quill_editor-9b402f092ddc5d16a887.js",
  "quill_editor.js.map": "/packs/js/quill_editor-9b402f092ddc5d16a887.js.map",
  "shared_javascript.js": "/packs/js/shared_javascript-f0cae6e551b8cfc573c9.js",
  "shared_javascript.js.map": "/packs/js/shared_javascript-f0cae6e551b8cfc573c9.js.map",
  "video_player.js": "/packs/js/video_player-8b5df237b6fc7da9efea.js",
  "video_player.js.map": "/packs/js/video_player-8b5df237b6fc7da9efea.js.map"
}

I have the feeling the manifest in not being updated with the new precompiled .css et .js assets hashes.

Any idea how i can solve this issue in production ? do i need to run a specific webpacker command on production to solve this issue. Thanks

Upvotes: 4

Views: 2695

Answers (1)

Lunik
Lunik

Reputation: 103

After hours of searching and asking questions elsewhere and experimenting, i finally came up with a solution that was radical but worked for me: I deleted current and releases folders on my server, then run, assets:clean, assets:clobber on my local computer, then set config.assets.compile = false in environement/production.rb, changed the output_path from packs to public/assets in webpacker.yml. Then i precompiled again locally then deployed. I skipped assets compiling again on server and it works!.

Upvotes: 2

Related Questions