Javascript ';jQuery';未定义无未定义
我有一个使用jQuery的文件,它仅用于测试目的:Javascript ';jQuery';未定义无未定义,javascript,jquery,reactjs,npm,create-react-app,Javascript,Jquery,Reactjs,Npm,Create React App,我有一个使用jQuery的文件,它仅用于测试目的: (function($) { "use strict"; // Start of use strict // Configure tooltips for collapsed side navigation $('.navbar-sidenav [data-toggle="tooltip"]').tooltip({ template: '<div class="tooltip navbar-sidenav-toolti
(function($) {
"use strict"; // Start of use strict
// Configure tooltips for collapsed side navigation
$('.navbar-sidenav [data-toggle="tooltip"]').tooltip({
template: '<div class="tooltip navbar-sidenav-tooltip" role="tooltip" style="pointer-events: none;"><div class="arrow"></div><div class="tooltip-inner"></div></div>'
})
// Toggle the side navigation
$("#sidenavToggler").click(function(e) {
e.preventDefault();
$("body").toggleClass("sidenav-toggled");
$(".navbar-sidenav .nav-link-collapse").addClass("collapsed");
$(".navbar-sidenav .sidenav-second-level, .navbar-sidenav .sidenav-third-level").removeClass("show");
});
// Force the toggled class to be removed when a collapsible nav link is clicked
$(".navbar-sidenav .nav-link-collapse").click(function(e) {
e.preventDefault();
$("body").removeClass("sidenav-toggled");
});
// Prevent the content wrapper from scrolling when the fixed side navigation hovered over
$('body.fixed-nav .navbar-sidenav, body.fixed-nav .sidenav-toggler, body.fixed-nav .navbar-collapse').on('mousewheel DOMMouseScroll', function(e) {
var e0 = e.originalEvent,
delta = e0.wheelDelta || -e0.detail;
this.scrollTop += (delta < 0 ? 1 : -1) * 30;
e.preventDefault();
});
// Scroll to top button appear
$(document).scroll(function() {
var scrollDistance = $(this).scrollTop();
if (scrollDistance > 100) {
$('.scroll-to-top').fadeIn();
} else {
$('.scroll-to-top').fadeOut();
}
});
// Configure tooltips globally
$('[data-toggle="tooltip"]').tooltip()
// Smooth scrolling using jQuery easing
$(document).on('click', 'a.scroll-to-top', function(event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: ($($anchor.attr('href')).offset().top)
}, 1000, 'easeInOutExpo');
event.preventDefault();
});
})(jQuery); // End of use strict
我已经在index.js
中添加了jquery
,但为什么它仍然抱怨?我使用创建我的reactjs应用程序。
index.js
如下所示:
import React from 'react';
import ReactDOM from 'react-dom';
/* Import css */
import 'font-awesome/css/font-awesome.css';
import './index.css';
/* Import javascript */
import 'bootstrap';
import 'jquery';
import './SbAdmin/js/sb-admin';
import App from './App/AppContainer.bs';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();
从“React”导入React;
从“react dom”导入react dom;
/*导入css*/
导入'font-awesome/css/font-awesome.css';
导入“./index.css”;
/*导入javascript*/
导入“引导”;
导入“jquery”;
导入“/SbAdmin/js/sb admin”;
从“./App/AppContainer.bs”导入应用程序;
从“./registerServiceWorker”导入registerServiceWorker;
ReactDOM.render(,document.getElementById('root'));
registerServiceWorker();
如您所见,jQuery
已导入。我做错了什么?在您使用jQuery的文件中,只包括这一行
import jQuery from 'jquery'
这样,您就不需要将它包含在app.js文件中,只需要包含您正在使用它的文件。您是否从某个地方导入jQuery?这是抱怨,因为在函数结束时,您正在传递jQuery,以便在函数中用作$。在不导入它的情况下,我假设您将其作为一个全局文件,在这种情况下,您可能需要添加一个
//eslint disable line no undef
我更新我的帖子。
import jQuery from 'jquery'