LoginSignup
11
8

More than 5 years have passed since last update.

railsアプリをherokuに上げてJSが動かないけどassets precompile以外が原因だった話

Posted at

起こったこと

ローカルで動くjqueryが、herokuにあげると動かなくなる。(モーダルが出ない)
ググってアセットプレコンパイル周りが怪しいと言われるが、
それらをいじっても解決しない。

原因と解決策

application.jsの中で
jqueryを先に読み込まないとダメだった。

修正前(下3行を上に持ってきた。)

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's
// vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
ここから下3行を
//= require jquery3
//= require popper
//= require bootstrap-sprockets

修正後


// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's
// vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
ここに入れた
//= require jquery3
//= require popper
//= require bootstrap-sprockets
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .

herokuにデプロイし直して無事完了。

11
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
8