Rails5.1.3でWebアプリを作っており、(初心者なので参考書を見ながらです。)jqueryのTag-itを導入時のエラーについて質問させて
いただきます。1つ前に質問しましたが回答が得られなかったので簡単な質問にさせていただきました。
jquery-ui-rails-6.0.1 で開発しております。
Tag-itをアプリに組み込もうとapp/assets/javascripts/staff.jsというファイルとapp/assets/stylesheets/staff.cssに以下のように記述しました.するとエラーが発生してしまいます。解決方法をご存じでしたら教えていらだけないでしょうか?
app/assets/javascripts/staff.js //= require jquery //= require rails-ujs //= require jquery_ujs //= require jquery.turbolinks //= require turbolinks //= require jquery.ui.all //= require jquery-ui/widgets/datepicker //= require jquery-ui/i18n/datepicker-ja //= require tag-it //= require_tree ./shared //= require_tree ./staff
app/assets/stylesheets/staff.css /* *= require jquery-ui/datepicker *= require jquery.tagit *= require_tree ./shared *= require_tree ./staff */
JavaScriptプログラム
app/assets/javascripts/staff/tag-it.js.coffee $(document).on 'turbolinks:load', -> $("#tag-it").tagit()
上記でリロードすると発生するエラー
Sprockets::FileNotFound in Staff::Messages#show Showing /home/vagrant/chibi/chibi/app/views/layouts/staff.html.erb where line #6 raised: couldn't find file 'jquery.ui.all' with type 'application/javascript' Checked in these paths: /home/vagrant/chibi/chibi/app/assets/config /home/vagrant/chibi/chibi/app/assets/images /home/vagrant/chibi/chibi/app/assets/javascripts /home/vagrant/chibi/chibi/app/assets/stylesheets /home/vagrant/chibi/chibi/vendor/assets/javascripts /home/vagrant/chibi/chibi/vendor/assets/stylesheets /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/jquery-turbolinks-2.1.0/vendor/assets/javascripts /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/jquery-ui-rails-6.0.1/app/assets/images /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/jquery-ui-rails-6.0.1/app/assets/javascripts /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/jquery-ui-rails-6.0.1/app/assets/stylesheets /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/jquery-rails-4.3.1/vendor/assets/javascripts /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/coffee-rails-4.2.2/lib/assets/javascripts /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actioncable-5.1.3/lib/assets/compiled /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/actionview-5.1.3/lib/assets/compiled /home/vagrant/.rbenv/versions/2.3.1/lib/ruby/gems/2.3.0/gems/turbolinks-source-5.0.3/lib/assets/javascripts Extracted source (around line #6): 4 //= require jquery.turbolinks 5 //= require turbolinks 6 //= require jquery.ui.all 7 //= require jquery-ui/widgets/datepicker 8 //= require jquery-ui/i18n/datepicker-ja 9 //= require tag-it Rails.root: /home/vagrant/chibi/chibi Application Trace | Framework Trace | Full Trace app/assets/javascripts/staff.js:6 app/views/layouts/staff.html.erb:6:in `_app_views_layouts_staff_html_erb___3988381759139252788_70101439000720'
app/views/layouts/staff.html.erb <!DOCTYPE html> <html> <head> <title><%= document_title %></title> <%= stylesheet_link_tag 'staff', media: 'all', 'data-turbolinks-track' => true %> <%= javascript_include_tag 'staff', 'data-turbolinks-track' => true %> #エラ-発生 <%= csrf_meta_tags %> </head> <body> <div id="wrapper"> <%= render 'staff/shared/header' %> <div id="container"> <%= yield %> </div> <%= render 'shared/footer' %> </div> </body> </html>
というエラーが発生してしまい解決方法がわからず困っております。となたか助けていただけないでしょうか?
宜しくお願いします。
追記:(記述例と説明文)
gem 'jquery-ui-rails', '~> 4.2.1'での実行環境での説明だったので元々の記述例は下記でした。
//= require jquery //= require jquery_ujs //= require turbolinks //= require jquery.ui.datepicker //= require jquery.ui.datepicker-ja //= require_tree ./shared //= require_tree ./staff
自分の実行環境はjquery-ui-rails-6.0.1 なので以下に変更しました。
//= require jquery //= require rails-ujs //= require jquery_ujs //= require jquery.turbolinks //= require turbolinks //= require jquery-ui/widgets/datepicker //= require jquery-ui/i18n/datepicker-ja //= require_tree ./shared //= require_tree ./staff
Tag-itを導入するにあたり以下のようにしてくださいとの説明がありました。
(参考書の実行環境はjquery-ui-rails 4.2.1での説明です。)
説明分及び記述例
Tag-itを組み込みます。
//= require jquery //= require jquery_ujs //= require turbolinks //= require jquery.ui.all //= require jquery.ui.datepicker-ja //= require tag-it //= require_tree ./shared //= require_tree ./staff
Tag-itはDatepicker以外のjQuery UIウィジェットに依存しますので4行目の「datepicker」を「all」に書き換えます。
という説明でした。
なので
//= require jquery //= require rails-ujs //= require jquery_ujs //= require jquery.turbolinks //= require turbolinks //= require jquery.ui.all //= require jquery-ui/widgets/datepicker //= require jquery-ui/i18n/datepicker-ja //= require tag-it //= require_tree ./shared //= require_tree ./staff
のように記述してみたのですが、全く違う記述をしているようなので、どう記述すれば組み込むことができるのかがわかりません。
助けていただけないでしょうか?宜しくお願いします。
タブ欄に入力ができないページになってます。
回答1件
あなたの回答
tips
プレビュー