Как исправить "ReferenceError: $ не определено" в Ruby на рельсах?

Question

Я пытаюсь выполнить ajax-вызов в Javascript в моем приложении на Ruby On Rails, но я получаю ошибку «ReferenceError: $ is notfined». Но мой jquery также установлен в моем приложении. Я смотрю другие темы, но решение не работает, поэтому я создаю эту тему

Я попробовал этот код ниже в моей среде. Js:

const { environment } = require('@rails/webpacker')

const webpack = require('webpack')
environment.plugins.append('Provide', new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery',
  Popper: ['popper.js', 'default']
}))

module.exports = environment

Я попыталсяудалить турболинку, ничего не изменить:

<% content_for :javascript do %>
  <script>

    var textarea = document.getElementById('biography-editor');
    var text = document.getElementById('biography');
    var btn = document.getElementById('submit-biography');

    function edit_biography() {
      btn.innerHTML = 'Sauvegarder';
      btn.setAttribute( "onClick", "save_biography()" );
      textarea.style.display = 'block';
      text.style.display = 'none';
    }

    function save_biography() {
      btn.innerHTML = 'Modifier ma biographie';
      btn.setAttribute( "onClick", "edit_biography()" );
      textarea.style.display = 'none';
      text.style.display = 'block';

      var content = textarea.innerHTML;

      $.ajax({
        url : '/user/updateBiography',
        type : 'POST',
        data : content
      });
    }
  </script>
<% end %>

Я хочу, чтобы мой javascript работал и понял эту проблему.

Спасибо

Answer 1

Я наконец нашел решение здесь: https://www.botreetechnologies.com/blog/introducing-jquery-in-rails-6-using-webpacker

Проблема заключалась в том, что WebPacker включили в Rails 6. Если у вас возникла та же проблема. Попробуйте следовать руководству.

Спасибо

Answer 2

Вы можете использовать Vanilla JS

xhr = new XMLHttpRequest();
xhr.open('POST', '/user/updateBiography');
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send(encodeURI('data=' + content));