web-dev-qa-db-ja.com

Rails 6：Webpackerを介してjquery-uiを追加する方法？

現在、アプリケーションに日付ピッカーを実装しようとしています。問題は、webpackerを介してjquery-ui-Rails gemを追加する方法に関するドキュメントがないことです。

おそらく、私のニーズに合う宝石または別の宝石を追加する別の方法がありますか？

ruby-on-railsjquery-uiwebpackerruby-on-rails-6
5
arnasklas

カルマンの答えは、jQueryをapp/javascriptディレクトリ内のスクリプトのスコープ内に置きますが、WebページにあるインラインJavaScriptは含みません。

WebページのスコープからjQueryにアクセスする場合は、jQueryをpublicディレクトリの下に配置し、app/views/layouts/application.html.erbを変更して次のようにリンクします。

<!DOCTYPE html>
<html>
  <head>
    <title>JqueryTest</title>
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>

    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>


    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
    <script src="/jquery-3.4.1.js"></script>
    <%= stylesheet_link_tag "/jquery-ui-1.12.1.custom/jquery-ui.min.css" %>
    <script src="/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>


  </head>

  <body>
    <%= yield %>
  </body>
</html>
1
webprogrammer

上記の手順は問題なく機能し、余分な手順は削除されました

次の手順は、jquery-uiがRails 6で動作するようにするために機能しました。

1）ターミナルで、アプリケーションタイプ内：
yarn add jquery-ui-dist

2）app/javascript/packs/application.js
require（ "jquery-ui-dist/jquery-ui"）;

3）application.html.erbに、jquery-uiテーマを含めます

<％= stylesheet_link_tag '//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/le-frog/jquery-ui.min.css'％>

4）Railsサーバーとwebpack開発サーバーを再起動します。

0
Tushar Patil