Нужно ли импортировать jquery в каждый файл react приложения?

Question

[Георгий]

Добрый день.
Есть react приложение состоящее из нескольких файлов.
В некоторых из этих файлов используется jquery.
jquery установлен с помощью npm,
В app.js прописан импорт jquery

код app.js

import $ from 'jquery';
import Task from './Task/Task';
import './App.css';
function App() {
  return <Task/>
}
export default App;

Однако, если я также не вставлю строку импорта jquery в файлы, которые его используют, то будет ошибка

'$' is not defined

код Task.js

import './Task.css';
import $ from 'jquery';
function Task(props){
  $(".task").click(function(){
    this.parent().toggleClass('task_theme_done')
  })
  return(
    <div className="task">
    </div>
  )
}
export default Task;

Можно ли импортировать jquery единожды, допустим, только в app.js и более не импортировать его в других файлах?
Как это реализовать?

Заранее спасибо за ответы.

P.S.
Пробовал найти решение данной проблемы в интернете, но там в основном пишут, что нужно вставлять
<script src = jquery/> выше ссылки на
<script src=react.js/>
в файле index.html.
Но в react приложении нет index.html .

Comments

[WbICHA]

А по какой причине ты вообще жквери в реакте используешь?

[WbICHA]

Тем более для такого.

$(".task").click(function(){
    this.parent().toggleClass('task_theme_done')
  })

[Георгий]

WbICHA, Теперь когда вы написали, я понял, что можно попробовать изменить класс с помощью средств самого react'a
Но проблема повторяется также и для хука useState
Строку import { useState } from 'react';
Приходится повторять данную строку везде, где используется данный хук.
Подумал, что решение с jquery подойдёт и для хуков.

[WbICHA]

Георгий, может стоило для начала изучить сам жс? Особенно с учётом того, что ты с ним уже несколько лет работаешь.

Answer 1

[black1277]

Да нужно. Почитайте про модули и пространства имен. В финальном проекте jquery будет включен один раз(не бойтесь дублирования не будет).

Comments

[Георгий]

Спасибо за совет.
Буду ознакамливаться.