teratail
回答率
85.29%
質問するログイン新規登録
トップに関する質問[rails6]<%= javascript_pack_tag ~ %> を記述すると heroku で エラーが出る

編集履歴

質問編集履歴

6

2020/11/24 10:25

投稿

ayus
ayus

スコア30

title CHANGED
File without changes
body CHANGED
@@ -13,7 +13,7 @@
13
13
  ↓
14
14
  <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
15
15
 
16
- に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。開発環境では表示できます。
16
+ に変更したところ、herokuにて下記のエラーが出てページが表示できなくなりました。開発環境では表示できます。
17
17
 
18
18
  「We're sorry, but something went wrong.」
19
19
 
@@ -63,7 +63,7 @@
63
63
  ```
64
64
  //package.json
65
65
  {
66
- "name": "questboard",
66
+ "name": "myapp",
67
67
  "private": true,
68
68
  "dependencies": {
69
69
  "@fortawesome/fontawesome-free": "^5.15.0",
@@ -83,5 +83,5 @@
83
83
  }
84
84
 
85
85
  ```
86
- 開発環境で同じエラーが出たときはrails webpacker:compleで解消したので、herokuでwebpackのコンパイルができないのが問題なのかなと思うのですが、ググりまくっても解決しません。
86
+ 開発環境で同じエラーが出たときはrails webpacker:compleで解消できたので、herokuでwebpackのコンパイルができないのが問題なのかなと思うのですが、ググりまくっても解決しません。
87
87
  アドバイス頂けると助かります。

5

2020/11/24 10:25

投稿

ayus
ayus

スコア30

title CHANGED
File without changes
body CHANGED
@@ -4,6 +4,8 @@
4
4
  cloud9
5
5
  heroku
6
6
 
7
+ herokuでwebpakを使いたい。
8
+
7
9
  ### 発生している問題・エラーメッセージ
8
10
  apprication.erb の head の記述を、
9
11
 
@@ -11,7 +13,8 @@
11
13
  ↓
12
14
  <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
13
15
 
14
- に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。
16
+ に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。開発環境では表示できます。
17
+
15
18
  「We're sorry, but something went wrong.」
16
19
 
17
20
  ```ruby
@@ -80,4 +83,5 @@
80
83
  }
81
84
 
82
85
  ```
86
+ 開発環境で同じエラーが出たときはrails webpacker:compleで解消したので、herokuでwebpackのコンパイルができないのが問題なのかなと思うのですが、ググりまくっても解決しません。
83
87
  アドバイス頂けると助かります。

4

2020/11/24 10:11

投稿

ayus
ayus

スコア30

title CHANGED
@@ -1,1 +1,1 @@
1
- javascript_pack_tag を記述すると heroku で エラーが出る
1
+ [rails6]<%= javascript_pack_tag ~ %> を記述すると heroku で エラーが出る
body CHANGED
@@ -1,28 +1,26 @@
1
1
  ### 前提・実現したいこと
2
2
  rails 6.0.2
3
3
  ruby 2.6.3
4
+ cloud9
5
+ heroku
4
6
 
7
+ ### 発生している問題・エラーメッセージ
5
- チャット機能を実装したアプリをherokuで動かしたいが、webpack 関連のエラーが出ます。
8
+ apprication.erb の head の記述を、
6
- ローカルでは動きます。
7
9
 
8
-
9
- ### 発生している問題・エラーメッセージ
10
- WebSocket を有効化するために apprication.erb の head の記述を、
11
10
  <%= javascript_include_tag "application" %>　　　　　　　
12
11
  ↓
13
12
  <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
13
+
14
- に変更したところ、herokuにて下記のエラーが出るようになりました、
14
+ に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。
15
15
  「We're sorry, but something went wrong.」
16
16
 
17
17
  ```ruby
18
- : I, [2020-10-10T00:42:15.709067 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Started GET "/login" for 101.110.62.78 at 2020-10-10 00:42:15 +0000
19
- : I, [2020-10-10T00:42:15.709955 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Processing by SessionsController#new as HTML
20
- : I, [2020-10-10T00:42:15.712763 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Rendering sessions/new.html.erb within layouts/application
21
- : I, [2020-10-10T00:42:15.716592 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Rendered sessions/new.html.erb within layouts/application (Duration: 3.7ms | Allocations: 1578)
22
- : I, [2020-10-10T00:42:15.717528 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Completed 500 Internal Server Error in 7ms (ActiveRecord: 0.0ms | Allocations: 3183)
23
- : at=info method=GET path="/login" host=myapp.herokuapp.com request_id=f7d73805-9cae-401e-abb0-1f494b9b9df0 fwd="101.110.62.78" dyno=web.1 connect=1ms service=12ms status=500 bytes=1733 protocol=https
24
- : F, [2020-10-10T00:42:15.718412 #4] FATAL -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0]
25
- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] ActionView::Template::Error (Webpacker can't find application.js in /app/public/packs/manifest.json. Possible causes:
18
+ hroku logs
19
+
20
+ : at=info method=GET path="/" host=myapp.herokuapp.com request_id=48f21ee2-ac29-495a-a8b2-773241aa814a fwd="126.255.21.241" dyno=web.1 connect=0ms service=430ms status=500 bytes=1733 protocol=https
21
+ : I, [2020-11-24T09:58:59.430455 #9] INFO -- : [48f21ee2-ac29-495a-a8b2-773241aa814a] Completed 500 Internal Server Error in 418ms (ActiveRecord: 138.8ms | Allocations: 65476)
22
+ : F, [2020-11-24T09:58:59.431748 #9] FATAL -- : [48f21ee2-ac29-495a-a8b2-773241aa814a]
23
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] ActionView::Template::Error (Webpacker can't find application.js in /app/public/packs/manifest.json. Possible causes:
26
24
  : 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.
27
25
  : 2. webpack has not yet re-run to reflect updates.
28
26
  : 3. You have misconfigured Webpacker's config/webpacker.yml file.
@@ -31,48 +29,55 @@
31
29
  : {
32
30
  : }
33
31
  : ):
34
- 10: <%= csp_meta_tag %>
35
- 11:
36
- 12: <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
37
- 13: <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
38
- 14:
39
- 15: <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">>
40
- 16:
32
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 20: <!--<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootswatch/4.5.2/sandstone/bootstrap.min.css" integrity="sha384-zEpdAL7W11eTKeoBJK1g79kgl9qjP7g84KfK3AZsuonx38n8ad+f5ZgXtoSDxPOh" crossorigin="anonymous">-->
33
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 21: <%#= stylesheet_pack_tag 'application' %>
34
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 22:
35
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 23: <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
36
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 24: <%#= javascript_include_tag "application", 'data-turbolinks-track': 'reload' %>
37
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 25:
38
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 26:
39
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a]
40
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] app/views/layouts/application.html.erb:23
41
+ : at=info method=GET path="/favicon.ico" host=myapp.herokuapp.com request_id=c3a45a26-bec4-4ffb-ad8c-7b64bc90069f fwd="126.255.21.241" dyno=web.1 connect=0ms service=12ms status=200 bytes=207 protocol=https
41
42
 
42
- app/views/layouts/application.html.erb:13
43
43
  ```
44
- <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
45
- を削除すればエラーは消えますが、websocket が機能せず、postやdeleteのリクエストが全てgetになってしまい、ログイン等が出来なくなります。
46
- また、<%= javascript_include_tag "application" %>　に戻すと、websocketが機能しません。
47
44
 
48
45
  ### 該当のソースコード
46
+
49
- ```ここに言語名を入力
47
+ ```
50
- <!DOCTYPE html>
51
- <html lang="ja" >
48
+ // /app/javascript/packs/application.js
52
49
 
53
- <head>
54
- <title>MyApp</title>
50
+ require("@rails/ujs").start();
51
+ require("turbolinks").start();
52
+ require("@rails/activestorage").start();
53
+ require("channels");
54
+ require("jquery");
55
+ require("animate.js");
55
56
 
56
- <meta charset="utf-8">
57
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
58
- <%= csrf_meta_tags %>
59
- <%= csp_meta_tag %>
60
-
61
- <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
62
- <%#= javascript_include_tag "application" %>
63
- <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
64
-
65
- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">>
66
-
67
- </head>
57
+ import "bootstrap";
58
+ import '../src/application.scss';
68
59
  ```
69
60
  ```
61
+ //package.json
62
+ {
63
+ "name": "questboard",
64
+ "private": true,
65
+ "dependencies": {
66
+ "@fortawesome/fontawesome-free": "^5.15.0",
67
+ "@rails/actioncable": "^6.0.0",
70
- /app/javascript/packs/application.js
68
+ "@rails/activestorage": "^6.0.0",
69
+ "@rails/ujs": "^6.0.3-3",
70
+ "@rails/webpacker": "^4.3.0",
71
+ "bootstrap": "^4.5.3",
72
+ "jquery": "^3.5.1",
73
+ "node-sass": "^4.14.1",
74
+ "popper.js": "^1.16.1",
75
+ "turbolinks": "^5.2.0"
76
+ },
77
+ "devDependencies": {
78
+ "webpack-dev-server": "^3.11.0"
79
+ }
80
+ }
71
81
 
72
- require("@rails/ujs").start()
73
- require("turbolinks").start()
74
- require("@rails/activestorage").start()
75
- require("channels")
76
82
  ```
77
-
78
83
  アドバイス頂けると助かります。

3

2020/11/24 10:07

投稿

ayus
ayus

スコア30

title CHANGED
File without changes
body CHANGED
@@ -51,7 +51,7 @@
51
51
  <html lang="ja" >
52
52
 
53
53
  <head>
54
- <title>QuestBoard</title>
54
+ <title>MyApp</title>
55
55
 
56
56
  <meta charset="utf-8">
57
57
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

2

タイトル修正

2020/10/11 14:51

投稿

ayus
ayus

スコア30

title CHANGED
@@ -1,1 +1,1 @@
1
- heroku で javascript_pack_tag が使えない
1
+ javascript_pack_tag を記述すると heroku で エラーが出る
body CHANGED
File without changes

1

修正

2020/10/10 03:55

投稿

ayus
ayus

スコア30

title CHANGED
File without changes
body CHANGED
@@ -74,5 +74,5 @@
74
74
  require("@rails/activestorage").start()
75
75
  require("channels")
76
76
  ```
77
- jsやwebpackに関する知識が不足しているのもあり、検索してみても結局自分の場合は何処を弄れば良いのか良くわかりません。
77
+
78
78
  アドバイス頂けると助かります。