Unable to install 'Trix' in an existing app

128 Views Asked by At

I've spent some time on trying to add function of uploading, posting and displaying images in my application. I've tried different methods, eventually finding out that 'Trix' is what I need to reach that goal. The issue here is that my application structure is quite different from those that I see in 'trix' tutorials, and I have no idea what I am doing :(((

Let's start from the fact that my application.js is located in ->


[app]>
     -[javascript]
       -[packs]
        -application.js

and looks very different from what I see in tutorials. However, I tried to adapt like so -


...

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require('trix')
...

Instead of writing //= require trix. Another slight difference is that my "application.css" is not ".scss", but I figured it is not that big of a deal. So I went ahead and pasted *= require trix in there. At first , when I loaded page I've got an error couldn't find file 'trix' with type 'text/css' , but after restarting server it wasn't there anymore (which is normal). Next step would be adding the code ... but it seems that most people have _form.html.erb. And here is where I need help. my "Post" structure is like this ->


[views]>
 - edit.html.erb
 - index.html.erb
 - new.html.erb
 - show.html.erb

where new.html.erb contains the form for submitting a post ->


<div class="main posts-new">
  <div class="container">
    <h1 class="form-heading">Create a new post</h1>
    <%= form_tag("/posts/create") do %>
      <div class="form">
        <div class="form-body">
          <% @post.errors.full_messages.each do |message| %>
            <div class="form-error">
              <%= message %>
            </div>
          <% end %>

          <textarea name="content"><%= @post.content %></textarea>
          <input type="submit" value="Post">
        </div>
      </div>
    <% end %>
  </div>
</div>

This is where the difference really confuses me... Where do I add 'trix' ? I've tried replacing textarea with trix-editor, the only changes I've got , where two small overlapping squares instead of submit form. Help. :(

0

There are 0 best solutions below