Home > Software engineering >  My html template carousel not working on react
My html template carousel not working on react

Time:02-16

I bought html template. When I try to use it on react project, some of function not working. One of it owl carousel. owl.js template file dynamically adding divs and styling them. This section working on html page but not on react. I do not get any error from console.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>aaa</title>
    <link href="assets/css/bootstrap.css" rel="stylesheet"/>
    <link href="assets/css/style.css" rel="stylesheet"/>
    <link href="assets/css/responsive.css" rel="stylesheet"/>
    <link rel="shortcut icon" href="assets/images/favicon.png" type="image/x-icon"/>
    <link rel="icon" href="assets/images/favicon.png" type="image/x-icon"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, 
    user-scalable=0">
</head>
<body>
    <div id="root"></div>    
    <script src="assets/js/jquery.js"></script> 
    <script src="assets/js/popper.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/js/jquery-ui.js"></script>
    <script src="assets/js/jquery.fancybox.js"></script>
    <script src="assets/js/owl.js"></script>
    <script src="assets/js/wow.js"></script>
    <script src="assets/js/isotope.js"></script>
    <script src="assets/js/mixitup.js"></script>
    <script src="assets/js/appear.js"></script>
    <script src="assets/js/validate.js"></script>
    <script src="assets/js/script.js"></script>   
    <script src="assets/js/map-script.js"></script>
</body>
</html>

CodePudding user response:

With React your public files, such as JavaScript files, should be in a folder called 'public' in your React app, then in the index.html this should be denoted by '%PUBLIC_URL%'. So in other words, move your assets folder to a folder called public and add '%PUBLIC_URL%/' before the paths for your files.

CodePudding user response:

After 4 hour i found solition for my problem. It is define script links on component instead of index.html. Hope this post helps more people

  • Related