Редактор Trix больше не отображает

#ruby-on-rails #ruby #trix

Вопрос:

Я пытаюсь добавить actiontext/trix в свое приложение для блога rails. В настоящее время у меня есть 3 модели, я хочу использовать текст действия для 2 из них статей и комментариев (третья модель-аутентификация разработки). Я несколько раз просматривал установку и настройку документации и не знаю, что не так. Вместо редактора 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 %>
 

статья.рб

 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
 

комментарий.рб

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

The important part my article controller
articles_controller.rb

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

Important part of my comment controller
comments_controller.rb

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

application.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? Заранее спасибо.

Комментарии:

1. это, вероятно, вы не настроили js-сторону (или настроили неправильно), вам следует убедиться, что вы уже добавили trix пакет js, а также требуете его на applicaion.js, Или в случае , если вы используете ActionText , вы можете просто вызвать только команду bin/rails action_text:install , ссылку: guides.rubyonrails.org/action_text_overview.html#installation

2. Да, я использовал bin/rails action_text:install и я импортировал в application.js

3. Привет, у меня была та же проблема (запуск последних версий Rails 7[Ruby 3.0.3] на компьютере Apple M1). И, очевидно, чего-то, чего я не мог видеть, не хватало. Итак, я решил попробовать создать новое приложение просто для тестирования action_text функции, я воспроизвел (ЕЩЕ РАЗ) все шаги, описанные в rails guides as @LamPhan, и это определенно сработало. Мой Трикс-редактор работает и работает без проблем. Овации