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

編集履歴

質問編集履歴

6

2020/11/24 10:25

投稿

ayus
ayus

スコア30

test CHANGED
File without changes
test CHANGED
@@ -28,7 +28,7 @@
28
28
 
29
29
 
30
30
 
31
- に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。開発環境では表示できます。
31
+ に変更したところ、herokuにて下記のエラーが出てページが表示できなくなりました。開発環境では表示できます。
32
32
 
33
33
 
34
34
 
@@ -128,7 +128,7 @@
128
128
 
129
129
  {
130
130
 
131
- "name": "questboard",
131
+ "name": "myapp",
132
132
 
133
133
  "private": true,
134
134
 
@@ -168,6 +168,6 @@
168
168
 
169
169
  ```
170
170
 
171
- 開発環境で同じエラーが出たときはrails webpacker:compleで解消したので、herokuでwebpackのコンパイルができないのが問題なのかなと思うのですが、ググりまくっても解決しません。
171
+ 開発環境で同じエラーが出たときはrails webpacker:compleで解消できたので、herokuでwebpackのコンパイルができないのが問題なのかなと思うのですが、ググりまくっても解決しません。
172
172
 
173
173
  アドバイス頂けると助かります。

5

2020/11/24 10:25

投稿

ayus
ayus

スコア30

test CHANGED
File without changes
test CHANGED
@@ -7,6 +7,10 @@
7
7
  cloud9
8
8
 
9
9
  heroku
10
+
11
+
12
+
13
+ herokuでwebpakを使いたい。
10
14
 
11
15
 
12
16
 
@@ -24,7 +28,9 @@
24
28
 
25
29
 
26
30
 
27
- に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。
31
+ に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。開発環境では表示できます。
32
+
33
+
28
34
 
29
35
  「We're sorry, but something went wrong.」
30
36
 
@@ -162,4 +168,6 @@
162
168
 
163
169
  ```
164
170
 
171
+ 開発環境で同じエラーが出たときはrails webpacker:compleで解消したので、herokuでwebpackのコンパイルができないのが問題なのかなと思うのですが、ググりまくっても解決しません。
172
+
165
173
  アドバイス頂けると助かります。

4

2020/11/24 10:11

投稿

ayus
ayus

スコア30

test CHANGED
@@ -1 +1 @@
1
- javascript_pack_tag を記述すると heroku で エラーが出る
1
+ [rails6]<%= javascript_pack_tag ~ %> を記述すると heroku で エラーが出る
test CHANGED
@@ -4,19 +4,17 @@
4
4
 
5
5
  ruby 2.6.3
6
6
 
7
+ cloud9
7
8
 
8
-
9
- チャット機能を実装したアプリをherokuで動かしたいが、webpack 関連のエラーが出ます。
10
-
11
- ローカルでは動きます。
9
+ heroku
12
-
13
-
14
10
 
15
11
 
16
12
 
17
13
  ### 発生している問題・エラーメッセージ
18
14
 
19
- WebSocket を有効化するために apprication.erb の head の記述を、
15
+ apprication.erb の head の記述を、
16
+
17
+
20
18
 
21
19
  <%= javascript_include_tag "application" %>　　　　　　　
22
20
 
@@ -24,7 +22,9 @@
24
22
 
25
23
  <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
26
24
 
25
+
26
+
27
- に変更したところ、herokuにて下記のエラーが出るようになりました、
27
+ に変更したところ、herokuにて下記のエラーが出てページが表示できなくなります。
28
28
 
29
29
  「We're sorry, but something went wrong.」
30
30
 
@@ -32,21 +32,17 @@
32
32
 
33
33
  ```ruby
34
34
 
35
- : 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
35
+ hroku logs
36
36
 
37
- : I, [2020-10-10T00:42:15.709955 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Processing by SessionsController#new as HTML
38
37
 
39
- : I, [2020-10-10T00:42:15.712763 #4] INFO -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] Rendering sessions/new.html.erb within layouts/application
40
38
 
41
- : 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)
39
+ : 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
42
40
 
43
- : 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)
41
+ : 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)
44
42
 
45
- : 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
43
+ : F, [2020-11-24T09:58:59.431748 #9] FATAL -- : [48f21ee2-ac29-495a-a8b2-773241aa814a]
46
44
 
47
- : F, [2020-10-10T00:42:15.718412 #4] FATAL -- : [f7d73805-9cae-401e-abb0-1f494b9b9df0]
48
-
49
- : [f7d73805-9cae-401e-abb0-1f494b9b9df0] ActionView::Template::Error (Webpacker can't find application.js in /app/public/packs/manifest.json. Possible causes:
45
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] ActionView::Template::Error (Webpacker can't find application.js in /app/public/packs/manifest.json. Possible causes:
50
46
 
51
47
  : 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.
52
48
 
@@ -64,92 +60,106 @@
64
60
 
65
61
  : ):
66
62
 
67
- 10: <%= csp_meta_tag %>
63
+ : [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">-->
68
64
 
69
- 11:
65
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 21: <%#= stylesheet_pack_tag 'application' %>
70
66
 
71
- 12: <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
67
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 22:
72
68
 
73
- 13: <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
69
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 23: <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
74
70
 
75
- 14:
71
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 24: <%#= javascript_include_tag "application", 'data-turbolinks-track': 'reload' %>
76
72
 
77
- 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">>
73
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 25:
78
74
 
79
- 16:
75
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] 26:
76
+
77
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a]
78
+
79
+ : [48f21ee2-ac29-495a-a8b2-773241aa814a] app/views/layouts/application.html.erb:23
80
+
81
+ : 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
80
82
 
81
83
 
82
84
 
83
- app/views/layouts/application.html.erb:13
84
-
85
85
  ```
86
-
87
- <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
88
-
89
- を削除すればエラーは消えますが、websocket が機能せず、postやdeleteのリクエストが全てgetになってしまい、ログイン等が出来なくなります。
90
-
91
- また、<%= javascript_include_tag "application" %>　に戻すと、websocketが機能しません。
92
86
 
93
87
 
94
88
 
95
89
  ### 該当のソースコード
96
90
 
97
- ```ここに言語名を入力
91
+
98
92
 
99
- <!DOCTYPE html>
93
+ ```
100
94
 
101
- <html lang="ja" >
95
+ // /app/javascript/packs/application.js
102
96
 
103
97
 
104
98
 
105
- <head>
99
+ require("@rails/ujs").start();
106
100
 
107
- <title>MyApp</title>
101
+ require("turbolinks").start();
102
+
103
+ require("@rails/activestorage").start();
104
+
105
+ require("channels");
106
+
107
+ require("jquery");
108
+
109
+ require("animate.js");
108
110
 
109
111
 
110
112
 
111
- <meta charset="utf-8">
113
+ import "bootstrap";
112
114
 
113
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
114
-
115
- <%= csrf_meta_tags %>
116
-
117
- <%= csp_meta_tag %>
118
-
119
-
120
-
121
- <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
122
-
123
- <%#= javascript_include_tag "application" %>
124
-
125
- <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
126
-
127
-
128
-
129
- <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">>
130
-
131
-
132
-
133
- </head>
115
+ import '../src/application.scss';
134
116
 
135
117
  ```
136
118
 
137
119
  ```
138
120
 
121
+ //package.json
122
+
123
+ {
124
+
125
+ "name": "questboard",
126
+
127
+ "private": true,
128
+
129
+ "dependencies": {
130
+
131
+ "@fortawesome/fontawesome-free": "^5.15.0",
132
+
133
+ "@rails/actioncable": "^6.0.0",
134
+
139
- /app/javascript/packs/application.js
135
+ "@rails/activestorage": "^6.0.0",
136
+
137
+ "@rails/ujs": "^6.0.3-3",
138
+
139
+ "@rails/webpacker": "^4.3.0",
140
+
141
+ "bootstrap": "^4.5.3",
142
+
143
+ "jquery": "^3.5.1",
144
+
145
+ "node-sass": "^4.14.1",
146
+
147
+ "popper.js": "^1.16.1",
148
+
149
+ "turbolinks": "^5.2.0"
150
+
151
+ },
152
+
153
+ "devDependencies": {
154
+
155
+ "webpack-dev-server": "^3.11.0"
156
+
157
+ }
158
+
159
+ }
140
160
 
141
161
 
142
162
 
143
- require("@rails/ujs").start()
144
-
145
- require("turbolinks").start()
146
-
147
- require("@rails/activestorage").start()
148
-
149
- require("channels")
150
-
151
163
  ```
152
164
 
153
-
154
-
155
165
  アドバイス頂けると助かります。

3

2020/11/24 10:07

投稿

ayus
ayus

スコア30

test CHANGED
File without changes
test CHANGED
@@ -104,7 +104,7 @@
104
104
 
105
105
  <head>
106
106
 
107
- <title>QuestBoard</title>
107
+ <title>MyApp</title>
108
108
 
109
109
 
110
110
 

2

タイトル修正

2020/10/11 14:51

投稿

ayus
ayus

スコア30

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

1

修正

2020/10/10 03:55

投稿

ayus
ayus

スコア30

test CHANGED
File without changes
test CHANGED
@@ -150,6 +150,6 @@
150
150
 
151
151
  ```
152
152
 
153
- jsやwebpackに関する知識が不足しているのもあり、検索してみても結局自分の場合は何処を弄れば良いのか良くわかりません。
153
+
154
154
 
155
155
  アドバイス頂けると助かります。