Solved: Module not found%3A Can%27t resolve %27jquery%27 in react

The main problem is that React cannot find the jQuery library.

-app/node_modules/bootstrap-daterangepicker

I'm trying to use the bootstrap-daterangepicker in my React project. I installed it using npm and imported it into my component. When I try to run the code, I get this error: 
<code>./node_modules/bootstrap-daterangepicker/daterangepicker.js
Module not found: Can't resolve 'jquery' in '/Users/myname/react-app/node_modules/bootstrap-daterangepicker'</code>
Here is my code: 


<code>import React from 'react';
import $ from 'jquery';
import DateRangePicker from 'bootstrap-daterangepicker';

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }  
   componentDidMount() {     $(function() {       $('input[name="datefilter"]').daterangepicker({         autoUpdateInput: false,         locale: {           cancelLabel: 'Clear'         }       });       $('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {         $(this).val(picker.startDate.format('MMM D') + ' - ' + picker.endDate.format('MMM D'));       });       $('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {         $(this).val('');       });     });   }   render() {     return (        &lt;div&gt;          &lt;h3&gt;Bootstrap dateranger picker example&lt;/h3&gt;          &lt;div className="form-group"&gt;            &lt;label htmlFor=""&gt;Select date range for report generation : &lt;span className="text-danger"&gt;"*" required field&lt;/span&gt;              &lt;br /&gt;"*" required field              &lt;br /&gt;"**" required field if "Select Date Range For Report Generation:" is selected as "Custom Date Range"            &lt;/label&gt;            &lt;div className="controls input-append date form_datetime" dataToggle dataTarget="#datetimePickerss1" dataPlacement={window.$("#datetimePickerss1").attr("dataPlacement")} title={window.$("#datetimePickerss1").attr("title")} onClick={window.$("#datetimePickerss1").trigger("click")} style={{cursor:'pointer'}} id="datetimePickerss1" name="datefilter" type="text" defaultValue="" readOnly /&gt;;          &lt;/div&gt;;        &lt;;      };    };export default MyComponent</code>

A:

The error is telling you that you need to install jquery in order to use the bootstrap-daterangepicker. You can do this by running npm install jquery.

How to solve module not found in js

There are a few ways to solve this issue. One way is to check if the module is available as a dependency in your project. You can do this by going to the dependencies section of your project in your terminal and looking for the module name. If it is not found, you can try searching for the module on npm or yarn. If that does not work, you can try using a bundler like webpack or rollup to bundle the module into your project.