Javascript 如何在Vue cli中导入外部脚本_Javascript_Vuejs2

Javascript 如何在Vue cli中导入外部脚本

javascript vuejs2

Javascript 如何在Vue cli中导入外部脚本,javascript,vuejs2,Javascript,Vuejs2,我尝试在vue cli应用程序中使用使用revolution slider的ready模板，如何使用此模板的外部脚本我已尝试导入模板在index.html中的标记中使用的脚本： <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name

我尝试在vue cli应用程序中使用使用revolution slider的ready模板，如何使用此模板的外部脚本

我已尝试导入模板在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>


巴拉德|政府HTML模板
很抱歉，没有启用JavaScript，brikma网站无法正常工作。请启用它
继续。

我通过了vue js组件中的模板主体，该模板由#app渲染

jquery在站点上工作，但是还有其他问题，没有显示revolution滑块

我还尝试将此包与节点模块一起使用，但我已经看到这种方法的工作非常困难

这是我的项目结构：这个文件夹是公开的，我把它们放在那里，index.html可以直接访问它们，这个文件夹在模板中（所有的js和css…）

我在console和build中没有任何问题

您能分享您的文件夹结构吗？您能确认页面上确实加载了rev slider JS脚本吗？此外，由于VueJS异步呈现页面，因此rev slider初始化/实例化其模板位于VueJS组件中的滑块可能为时已晚。您可能需要在

mounted

hook上手动初始化/实例化它。