Hovedproblemet er, at React ikke kan finde jQuery-biblioteket.
-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 ( <div> <h3>Bootstrap dateranger picker example</h3> <div className="form-group"> <label htmlFor="">Select date range for report generation : <span className="text-danger">"*" required field</span> <br />"*" required field <br />"**" required field if "Select Date Range For Report Generation:" is selected as "Custom Date Range" </label> <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 />; </div>; <; }; };export default MyComponent</code>
A:
Fejlen fortæller dig, at du skal installere jquery for at bruge bootstrap-daterangepicker. Du kan gøre dette ved at løbe npm install jquery.
Sådan løses modul ikke fundet i js
Der er et par måder at løse dette problem på. En måde er at tjekke om modulet er tilgængeligt som en afhængighed i dit projekt. Du kan gøre dette ved at gå til afhængighedsafsnittet i dit projekt i din terminal og se efter modulnavnet. Findes det ikke, kan du prøve at søge efter modulet på npm eller garn. Hvis det ikke virker, kan du prøve at bruge en bundler som webpack eller rollup til at samle modulet i dit projekt.