Angular7项目Revolution Slider报错：revslider_showDoubleJqueryError未定义

从你给出的错误信息和代码来看，这个问题的核心是脚本加载顺序错误——nile-slider.js执行时，Revolution Slider的核心函数还没被加载，导致找不到revslider_showDoubleJqueryError这个内置的错误处理函数。下面是具体的解决方案：

1. 紧急修复：调整脚本加载顺序 #

你当前的模板里先加载了nile-slider.js，但这个脚本依赖jQuery和Revolution Slider的核心库，必须把它放在所有依赖脚本之后加载。修正后的脚本加载顺序如下：

<!-- 先加载jQuery基础库 -->
<i let [appLoadscript]="'assets/landing_page/js/jquery-3.2.1.min.js'"></i>
<!-- 再加载Revolution Slider核心工具和核心库 -->
<i let [appLoadscript]="'assets/landing_page/rslider/js/jquery.themepunch.tools.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/jquery.themepunch.revolution.min.js'"></i>
<!-- 然后加载Revolution Slider的所有扩展脚本 -->
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.actions.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.carousel.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.kenburn.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.layeranimation.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.migration.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.navigation.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.parallax.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.slideanims.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/rslider/js/extensions/revolution.extension.video.min.js'"></i>
<!-- 接着加载其他基础依赖脚本 -->
<i let [appLoadscript]="'assets/landing_page/js/popper.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/js/bootstrap.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/js/owl.carousel.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/js/imagesloaded.min.js'"></i>
<i let [appLoadscript]="'assets/landing_page/js/YouTubePopUp.jquery.js'"></i>
<!-- 最后加载自定义滑块脚本和其他自定义脚本 -->
<i let [appLoadscript]="'assets/landing_page/js/nile-slider.js'"></i>
<i let [appLoadscript]="'assets/landing_page/js/custom.js'"></i>

2. 规范Angular脚本加载方式（推荐） #

在Angular中，不建议通过组件模板的自定义指令加载脚本，更稳定的方式是在angular.json中配置全局脚本，确保加载顺序的可控性：

打开项目根目录的angular.json，找到build.options.scripts数组，按顺序添加所有需要的脚本：

"scripts": [
  "src/assets/landing_page/js/jquery-3.2.1.min.js",
  "src/assets/landing_page/rslider/js/jquery.themepunch.tools.min.js",
  "src/assets/landing_page/rslider/js/jquery.themepunch.revolution.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.actions.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.carousel.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.kenburn.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.layeranimation.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.migration.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.navigation.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.parallax.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.slideanims.min.js",
  "src/assets/landing_page/rslider/js/extensions/revolution.extension.video.min.js",
  "src/assets/landing_page/js/popper.min.js",
  "src/assets/landing_page/js/bootstrap.min.js",
  "src/assets/landing_page/js/owl.carousel.min.js",
  "src/assets/landing_page/js/imagesloaded.min.js",
  "src/assets/landing_page/js/YouTubePopUp.jquery.js",
  "src/assets/landing_page/js/nile-slider.js",
  "src/assets/landing_page/js/custom.js"
]

配置完成后，你可以删掉landing-page.component.html里所有的<i>脚本加载标签，Angular会在构建时自动按顺序加载这些脚本。

3. 额外检查：确保RevSlider核心文件完整 #

如果调整顺序后仍报错，请检查jquery.themepunch.revolution.min.js文件是否完整——revslider_showDoubleJqueryError是RevSlider内置的函数，应该包含在这个核心文件中。如果文件损坏或缺失，重新下载并替换正确的RevSlider核心文件即可。

4. 解决Angular中jQuery的类型问题（可选） #

为了避免Angular中使用jQuery时出现类型报错，你可以在src/typings.d.ts文件中添加全局声明：

declare var jQuery: any;
declare var $: any;

这样就能在组件或外部脚本中正常使用jQuery了。

内容的提问来源于stack exchange，提问作者user11352561