I am creating one system using React and I am still new to React. I need to add js file in my index.html where that js file is located in the src folder. I need to import this js file in order to make my system works. Does anyone know how to solve my problem? Thanks in advance.
This is how I import my js file. I think there is something wrong with my path. Does anyone know the correct path to import my js file?
//index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script src=".3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src=".js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src=".1.1/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>
<script src="/@coreui/coreui/dist/js/coreui.min.js"></script>
<script src=".js/2.5.0/Chart.min.js" crossorigin></script>
<script type="text/javascript" src='../src/js/index.js'></script>
</body>
</html>
As you can see from the picture above, my index.js is located under the src folder.
I am creating one system using React and I am still new to React. I need to add js file in my index.html where that js file is located in the src folder. I need to import this js file in order to make my system works. Does anyone know how to solve my problem? Thanks in advance.
This is how I import my js file. I think there is something wrong with my path. Does anyone know the correct path to import my js file?
//index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script src="http://code.jquery./jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare./ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn./bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>
<script src="https://unpkg./@coreui/coreui/dist/js/coreui.min.js"></script>
<script src="https://cdnjs.cloudflare./ajax/libs/Chart.js/2.5.0/Chart.min.js" crossorigin></script>
<script type="text/javascript" src='../src/js/index.js'></script>
</body>
</html>
As you can see from the picture above, my index.js is located under the src folder.
Share Improve this question edited May 28, 2019 at 7:46 Roseanne asked May 28, 2019 at 7:19 RoseanneRoseanne 771 gold badge1 silver badge7 bronze badges 18-
This will resolve your issue
../src/js/index.js
.'/js
will try to locate in same folder. You will have to go to parent and then navigate to necessary file – Rajesh Commented May 28, 2019 at 7:22 - <script src='../src/js/index.js'></script> – Roy.B Commented May 28, 2019 at 7:22
- Thanks for the answer @Rajesh. However, its still not working – Roseanne Commented May 28, 2019 at 7:25
- Thanks for the answer @Roy.B. I already tried but its still not working – Roseanne Commented May 28, 2019 at 7:26
-
1
That means you're implicitly using webpack btw. It also means you should move the
js
folder to your public folder, then usesrc="%PUBLIC_URL%/js/index.js"
(but again, this is most likely not a good idea) – user5734311 Commented May 28, 2019 at 7:49
2 Answers
Reset to default 2As i think this is not good way to do this. your trying to add your ./src some js file to ./public folder index.html
this is not remended way. but if you want add some external links, put it under ./public folder and import it but this not remended way.
ref : sample project for external import
Path should be
<script src='../src/js/index.js'></script>
You need to go up one folder ('../'
) to be at the same spot as public
and src
then go into src/js/index.js