我正尝试在vue-cli应用程序中使用可使用Revolution滑块的现成模板,如何使用此模板的外部脚本?
我试图导入index.html标记中的模板所使用的脚本:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Balad | Govt HTML Template</title>
<!-- CSS Files -->
<link href="css/custom.css" rel="stylesheet">
<link href="css/responsive.css" rel="stylesheet">
<link href="css/color.css" rel="stylesheet">
<link href="css/all.css" rel="stylesheet">
<link href="css/owl.carousel.min.css" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/prettyPhoto.css" rel="stylesheet">
<link href="css/slick.css" rel="stylesheet">
<link rel="icon" href="images/fav.png" type="image/png">
<!--Rev Slider Start-->
<link rel="stylesheet" href="js/rev-slider/css/settings.css" type='text/css' media='all' />
<link rel="stylesheet" href="js/rev-slider/css/layers.css" type='text/css' media='all' />
<link rel="stylesheet" href="js/rev-slider/css/navigation.css" type='text/css' media='all' />
<!--Rev Slider End-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<noscript>
<strong>We're sorry but brikma-website doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<!-- JS -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.prettyPhoto.js"></script>
<script src="js/slick.min.js"></script>
<script src="js/custom.js"></script>
<!--Rev Slider Start-->
<script type="text/javascript" src="js/rev-slider/js/jquery.themepunch.tools.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/jquery.themepunch.revolution.min.js"></script>
<script type="text/javascript" src="js/rev-slider.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.actions.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.carousel.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.migration.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.navigation.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.parallax.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="js/rev-slider/js/extensions/revolution.extension.video.min.js"></script>
</body>
</html>
然后我越过#app渲染的vue js组件中模板的主体
该jQuery可以在网站上运行,但还有其他问题,旋转滑块未显示
我还尝试将这些软件包与节点模块一起使用,但是我发现用这种方法很难完成工作
这是我的项目结构: 我在公共文件夹中放置了index.html可以直接访问它们的文件夹,这些文件夹在模板中(所有js和css ...)
控制台和内部版本都没有问题