Webpacker を使用せずに ActionText を使用して Trix エディターを Rails アプリに追加しようとしています

概要

ActionText を備えた Trix エディターを Rails アプリに追加しようとしていますが、Webpacker は使用していません。公式ドキュメントに従っていますが、Webpackerの使用を前提としているようです。 Webpacker を使わずに Trix と ActionText を統合する方法を誰かが教えてくれませんか?

これまでに試したことは次のとおりです。

application.js は次のようになります。 「トリックス」をインポートします。 インポート “@rails/actiontext”;

ここでサイドエンター画像の説明をご覧ください。

ただし、Webpacker を使用せずに Trix エディターの JavaScript および CSS ファイルをインクルードする方法がわかりません。ご協力をいただければ幸いです。ありがとう！

解決策

「trix」と「@rails/actiontext」が application.js ファイルにインポートされている場合、2 番目のステップで表示される警告は無視してかまいません。

次に、trix を application.scss にインポートする必要があります。

@import "trix";

または、CSS ファイルをビューに直接インポートすることもできます。

<%= stylesheet_link_tag "actiontext", "data-turbo-track": "reload" %>

2 番目の方法を希望する場合は、actiontext も app/assets/config/manifest.js にリンクされていることを確認してください。

//= link actiontext.css

あとは、フォーム入力として rich_text_area を追加するだけです。

  <div class="form-group">
    <%= form.label :content, style: "display: block" %>
    <%= form.rich_text_area :content, class: 'form-control', rows: 3 %>
  </div>

この問題は https://github.com/rails/rails/issues/43441 でご覧いただけます。