1) Présentation de jQuery >> Bulletin

__1. Introduisez jquery avec yarn add jquery __ __2. Écrivez une description pour ajouter jQuery sous gestion à environment.js dans le fichier de configuration webpack __ __3. Écrivez une description pour appeler jQuery dans application.js __ __4. Vérifiez si l'appel javascript est décrit dans application.html.erb __

1) Présentation de jQuery >> Explication détaillée

1. Introduisez jquery avec yarn add jquery

Terminal
$ yarn init　*Remarque: je ne pense pas que ce soit nécessaire si vous avez déjà installé du fil sur votre système d'exploitation avec Homebrew.
$ yarn add jquery

__ * Supplément: __ Je n'ai aucun problème avec juste "yarn add jquery", mais quand j'ai vérifié les articles d'autres personnes, il y avait une explication que "yarn in it" devait être entré en premier, donc je l'ai écrit comme supplément. Laisse moi faire. Pour "Installer du fil avec Homebrew", l'article ici sera utile.

__ * Supplément 2: __ Il existe également un moyen d'écrire gem'jquery-rails 'dans le Gemfile, mais Rails 6 semble recommander l'ajout de fil. Cette fois, nous utilisons le package Node.js pour le gérer avec Webpacker.

2. environment.js

`app/config/webpack/environment.js`


//Copiez et collez cette description (la description originale peut être supprimée)
//Voici la description de l'ajout de jQuery sous gestion dans le fichier de configuration du webpack.
const { environment } = require('@rails/webpacker')
const webpack = require('webpack')

environment.plugins.prepend('Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    jquery: 'jquery',
  })
)

module.exports = environment

3. application.js

`app/javascript/packs/application.js`


//réduction
require("@rails/ujs").start()
require("turbolinks").start()  //Je commente toujours
require("@rails/activestorage").start()
require("channels")
require('jquery') //Ajoute ça
//réduction

__ * Remarque: __turbolinks utilise activement le cache, de sorte que les événements qui se produisent après le chargement de la page peuvent ne pas fonctionner. Je me rends compte que c'est un peu difficile d'utiliser javascript, alors commentez-le. (Si vous utilisez le cache, le temps de chargement de la page sera raccourci.)

4. application.html.erb ** Confirmé au cas où

`html.erb:app/view/layouts/application.html.erb`



<!--C'est ce qui se passe lorsque vous supprimez des tourbolinks-->
<%= stylesheet_link_tag 'application', media: 'all' %>
<%= javascript_pack_tag 'application' %>

C'est le flux jusqu'à l'introduction de Jquery.

2) La solution pour $ n'est pas une erreur définie

Si $ n'est pas défini, cela signifie que jQuery n'a pas été inséré correctement, donc je pense qu'il peut être résolu en vérifiant les 4 étapes expliquées dans l'introduction de jQuery.

c'est tout.

[RUBY] [Rails 6] Introduction de jQuery ・ La solution de l'erreur de référence non interceptée $ n'est pas définie