How to use javascript external library files in reactjs?

Question

I am new in Reactjs. I am integrating admin theme that contain JS libraries like graph,tooltip etc. I am facing issue it produce errors and also dropdown not working. My index.html file is with js files

<script src="./assets/js/main/jquery.min.js"></script>
<script src="./global_assets/js/main/bootstrap.bundle.min.js"></script>
<script src="./global_assets/js/plugins/loaders/blockui.min.js"></script>
<!-- /core JS files -->
<!-- Theme JS files -->
<script src="./global_assets/js/plugins/visualization/d3/d3.min.js"></script>
<script src="./global_assets/js/plugins/visualization/d3/d3_tooltip.js"></script>
<script src="./global_assets/js/plugins/forms/styling/switchery.min.js"></script>
<script src="./global_assets/js/plugins/ui/moment/moment.min.js"></script>
<script src="./global_assets/js/plugins/pickers/daterangepicker.js"></script>

<script src="assets/js/app.js"></script>
<script src="./global_assets/js/demo_pages/dashboard.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/streamgraph.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/sparklines.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/lines.js"></script>   
<script src="./global_assets/js/demo_charts/pages/dashboard/light/areas.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/donuts.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/bars.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/progress.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/heatmaps.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/pies.js"></script>
<script src="./global_assets/js/demo_charts/pages/dashboard/light/bullets.js"></script>
<!-- /theme JS files -->

and i am getting these issues and also dropdown not working how I can solve it.

Nikhil · Accepted Answer · 2021-05-08 08:08:32Z

0

You can use npm packages for the same.

react-d3-graph for d3 graphs
moment for moment
react-datepicker for date picker

Install npm packages using npm install command

Import them on your React Component whenever you want to use them using import command

import moment from 'moment';
import { Graph } from "react-d3-graph";

Check documentation of packages before implementing the same.

edited May 8, 2021 at 8:08

answered May 7, 2021 at 9:58

Nikhil

991 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nikhil Over a year ago

let me know in case you are still facing any issue

Collectives™ on Stack Overflow

How to use javascript external library files in reactjs?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related