0

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

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

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

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

我的源代码参考

4

2 回答 2

6

完美的选择，使用 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

于 2019-05-04T15:16:47.957 回答
0

我有部分答案给你！我想使用 Trix、Rails 5.2.2 和 Webpacker，但找不到明确的答案。trix gem 不起作用，因为我根本不使用资产管道。（我也使用 Turbolinks 和 Stimulus，到目前为止，这与它们一起工作得很好。）

我使用以下方法将解决方案串在一起：

我现在可以使用如下所示的表单助手（使用 Slim 模板语言）：

= f.trix :personal_notes, class: 'some-css-class'

为了到达那里，我做了以下事情：

  1. yarn add trix
  2. 在我的 Javascript 包中，import 'trix';
  3. 在我的 CSS 包中，@import '~trix/dist/trix';
  4. 然后我创建了表单助手。看起来是这样的：

在app/helpers/application_helper.rb中，我根据上面链接的 Stack 帖子添加了新的表单助手。我的文件现在看起来像这样：

module ApplicationHelper
    # ...

    class ActionView::Helpers::FormBuilder
        # include ActionView::Helpers::TagHelper # I didn't need this.
        include ActionView::Helpers::FormTagHelper
        include ActionView::Helpers::FormOptionsHelper
        # include ActionView::Helpers::CaptureHelper  # I didn't need this.
        # include ActionView::Helpers::AssetTagHelper  # I didn't need this.

        # since these tag helpers just return strings, it is easy to make a pretty 
        # powerful helper.  It is probably possible to use existing Rails form 
        # helpers to aid this as well.
        def trix(method, options = {})
          value = (@object[method].empty?) ? '' : "value='#{@object[method]}'" 
          return "<input id='#{field_id(method)}' type='hidden' name='#{field_name(method)}' #{value}><trix-editor input='#{field_id(method)}' class='trix-content #{options[:class]}'></trix-editor>".html_safe
        end

        def field_name(label,index=nil)
          return @object_name + "[#{label}]"
        end

        def field_id(label,index=nil)
          return @object_name + "_#{label}"
        end

    end
end

重启 Rails。似乎对我有用。

于 2019-01-02T18:15:37.110 回答