jsファイルが呼び出せない
Q&A
Closed
解決したいこと
viewファイル(show.html.erb)内で、javascript_pack_tag及びstylesheet_pack_tag
を指定してjsファイルを呼び出したいのですが、
Webpacker::Manifest::MissingEntryError in Rooms#show
というエラーが生じております。
エラーの内容を推察すると、Webpackが見つからないということと思われます。
他の記事を参考にしましたが、コードに問題はないかと...
他にどの部分が原因かがわかりません。
解決にご協力いただけないでしょうか。
参考記事
以下、現状のコード
app/views/rooms/show.html.erb
<div id="room">
<room />
</div>
<script src="app/javascript/packs/room"></script>
<%= javascript_pack_tag 'room' %>
<%= stylesheet_pack_tag 'room' %>
app/javascript/packs/room.js
import Vue from 'vue/dist/vue.esm'
import Room from '../room.vue'
document.addEventListener('DOMContentLoaded', () => {
const app = new Vue({
el: '#room',
data: {
},
components: { Room }
})
})
エラーの内容
Webpacker::Manifest::MissingEntryError in Rooms#show
Showing /Users/taniguroarata/projects/chat-app/app/views/rooms/show.html.erb where line #6 raised:
Webpacker can't find room in /Users/taniguroarata/projects/chat-app/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.
Your manifest contains:
{
"application.js": "/packs/js/application-c229f7c7014cf8c8d494.js",
"application.js.map": "/packs/js/application-c229f7c7014cf8c8d494.js.map",
"entrypoints": {
"application": {
"js": [
"/packs/js/application-c229f7c7014cf8c8d494.js"
],
"js.map": [
"/packs/js/application-c229f7c7014cf8c8d494.js.map"
]
},
"hello_vue": {
"js": [
"/packs/js/hello_vue-a8f8e7394cb89686e662.js"
],
"js.map": [
"/packs/js/hello_vue-a8f8e7394cb89686e662.js.map"
]
}
},
"hello_vue.js": "/packs/js/hello_vue-a8f8e7394cb89686e662.js",
"hello_vue.js.map": "/packs/js/hello_vue-a8f8e7394cb89686e662.js.map"
}
Extracted source (around line #6):
4
5
6
7
<script src="app/javascript/packs/room"></script>
<%= javascript_pack_tag 'room' %>
<%= stylesheet_pack_tag 'room' %>
Rails.root: /Users/taniguroarata/projects/chat-app
Application Trace | Framework Trace | Full Trace
app/views/rooms/show.html.erb:6
Request
Parameters:
{"id"=>"show"}
Toggle session dump
Toggle env dump
Response
Headers:
None
0