首页 > 解决方案 > Rails:如何在 Rails 5.2.1 中实现动作文本?

问题描述

在我的Rails 5.2.1应用程序中实现Action Text gem时遇到了困难。

我按照安装指南操作,富文本编辑器不会出现在我的 _form 视图中。

然后我意识到它需要带有webpackeractive storage的Rails 6。更改 gemfile 的 Rails 版本并运行rails upgrade不起作用,因此我添加了 webpacker 和活动存储 gem,并将其与我当前的 5.2.1 版本捆绑在一起。那也没有用。

我真的很想在我的应用程序中有一个富文本编辑器。它不是必须的 Trix 编辑器,但由于它将是 v6 的原生版本,我认为这是显而易见的选择。

我的源代码参考

标签: ruby-on-railsrubywysiwygrich-text-editortrix

解决方案


完美的选择,使用 rails 5.2.3 在我的新应用程序上进行了测试。请不要操作文本需要 ruby​​ 2.5.3 版本。第一:添加 webpacker

您可以使用新的 --webpack 选项在设置新的 Rails 5.1+ 应用程序期间添加 Webpacker:

可用的 Rails 5.1+

rails new myapp --webpack

或者将其添加到您的 Gemfile:

宝石文件

gem 'webpacker', '~> 4.x'

或者,如果您更喜欢使用 master

gem 'webpacker', git: 'https://github.com/rails/webpacker.git'
yarn add https://github.com/rails/webpacker.git

现在使用图像魔法将 Actiontext 添加到您的 gem 文件中:

gem'actiontext',github:'kobaltz/actiontext',branch:'archive',require:'action_text'
gem 'image_processing'

最后,运行以下命令来安装 Webpacker:

bundle
bundle exec rails webpacker:install

rails action_text:install
rails db:migrate
brew install imagemagick vips

将此添加到头部的视图/布局/应用程序中

#layouts/application.html.erb
<%= javascript_pack_tag 'application' %>

在您的模型中,它可能是一篇文章或您模型中的任何内容。

class Article < ApplicationRecord
  has_rich_text :content
end

在你的控制器中

 #controllers/articles_controller.rb
    def article_params
      params.require(:article).permit(:name, :content)
    end

以你的形式

#_form.html.erb
<div class="field">
  <%= form.label :content %>
  <%= form.rich_text_area :content %>
</div>

最后在您的视图中显示内容;

<h1><%= @article.name %></h1>
<p><%= @article.content %></p>

可选:要修复“未满足的对等依赖性”警告,

yarn upgrade

你可以在这里观看完整的视频: https ://www.driftingruby.com/episodes/using-action-text-in-a-rails-5-2-application


推荐阅读