Trix エディターがレンダリングされなくなりました

概要

Rails ブログアプリケーションに actiontext/trix を追加しようとしています。現在 3 つのモデルがあり、そのうち 2 つの記事とコメントにアクションテキストを使用したいと考えています (3 番目のモデルは認証をデバイスします)。ドキュメントのインストールとセットアップを何度も繰り返しましたが、何が間違っているのかわかりません。 trix エディタの代わりに、これは新しい記事ページまたは編集記事ページのビューがレンダリングされるときに得られるものです。

これが私のフォームの一部です _form.html.erb

<%= form_with model: [ @article, @article.comments.build ] do |form| %>
    <p>
      <%= form.label :commenter %><br>
      <%= form.text_field :commenter, class:"form-control" %>
    </p>
    <div class="">
    <%= form.label :body %>
    <%= form.rich_text_area :body %>
  </div>
    <p>
        <%= form.label :status %><br>
        <%= form.select :status, ['public', 'private', 'archived'], selected: 'public', 
         :class => 'form-select' %>
    </p>
  
    <p>
      <%= form.submit 'Create Comment', :class => 'btn btn-outline-primary' %>
    </p>
  <% end %>

記事.rb

class Article < ApplicationRecord
    include Visible
    
    belongs_to :user
    has_many :comments, dependent: :destroy
    has_rich_text :body
    validates :title, presence: true
    validates :body, presence: true, length: { minimum: 10 }
  end

コメント.rb

class Comment < ApplicationRecord
  include Visible
  belongs_to :article
  has_rich_text :body
  validates :commenter, presence: true
  validates :body, presence: true, length: { minimum: 10 }
end

私の記事の管理者の重要な部分記事_コントローラー.rb

private
    def article_params
      params.require(:article).permit(:title, :body, :status, :user_id)
    end

コメントコントローラーの重要な部分コメントコントローラー.rb

private
      def comment_params
        params.require(:comment).permit(:commenter, :body, :status)
      end

アプリケーション.js

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.
//= require jquery_ujs 
import Rails from "@rails/ujs"
import Turbolinks from "turbolinks"
import * as ActiveStorage from "@rails/activestorage"
import "channels"
import "trix"
import "@rails/actiontext"
import "bootstrap"

Rails.start()
Turbolinks.start()
ActiveStorage.start()

require("trix")
require("@rails/actiontext")

パッケージ.json

{
  "name": "blog",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/actiontext": "^6.1.4-1",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "5.4.3",
    "bootstrap": "4.3.1",
    "jquery": "^3.6.0",
    "popper.js": "^1.16.1",
    "trix": "^1.2.0",
    "turbolinks": "^5.2.0",
    "webpack": "^4.46.0",
    "webpack-cli": "^3.3.12"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^3"
  }
}

trix エディターが適切にレンダリングされない原因は何ですか?よろしくお願いします。

解決策

コメントアウトすることでこの問題を回避できました。

#app/javascript/application.js

import "bootstrap"

そのインポートで目に見えないエラーが発生し、他のインポートが適切に実行されなくなったのだと思います。