【问题标题】:Scripts stop working after gulp concatgulp concat 后脚本停止工作
【发布时间】:2017-01-10 00:57:04
【问题描述】:

创建网站时,我曾经单独链接所有脚本,一切正常。我现在正在学习使用 gulp,并注意到在连接我的 JS 文件后,一些脚本停止工作(同样,它们在单独加载时都可以工作)。

我在网上发现的唯一一件事是我可能必须按特定顺序连接文件。我尝试更改 gulpfile.js 任务中的顺序无济于事。我尝试在 gulpfile.js 任务中一一删除文件,但无济于事。

此外,我将 Modernizr 和 JQuery 始终保留在页眉中并单独加载(它们不与其他文件连接),而连接的 JS 文件位于页脚中,因此在之后加载。

HTML 文件看起来像这样:

<!DOCTYPE html>
    <html>
    <head>

        <meta ...>
        <link...>

        <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
        <script src="https://code.jquery.com/jquery-migrate-3.0.0.min.js"></script>
        <script src="assets/scripts/modernizr.js"></script>

        <title>Some Title</title>

    </head>

    <body>

    WEBSITE CONTENT

        <script src="assets/scripts/scripts.min.js"></script> /*Concatenated file*/

    </body>
</html>

我的 gulp 任务 (gulpfile.js) 看起来像这样(我已经将脚本分开以连接到一个数组中,以便你们可以看到文件):

gulp.task('js', function(){
  return gulp.src([
      'assets/scripts/base/bootstrap.js',
      'assets/scripts/base/retina.js',
      'assets/scripts/base/smoothscroll.js',
      'assets/scripts/base/waypoints.js',
      'assets/scripts/base/wow.js',
      'assets/scripts/plugins/bootstrap.filestyle.js',
      'assets/scripts/plugins/jquery.counterup.js',
      'assets/scripts/plugins/jquery.matchHeight.js',
      'assets/scripts/plugins/lightcase.js',
      'assets/scripts/plugins/slick.js',
      'assets/scripts/plugins/global.js'
  ])
    .pipe(plumber({
      errorHandler: function (error) {
        console.log(error.message);
        this.emit('end');
    }}))
    .pipe(concat('scripts.js'))
    .pipe(babel())
    .pipe(gulp.dest('assets/scripts/'))
    .pipe(rename({suffix: '.min'}))
    .pipe(uglify())
    .pipe(gulp.dest('assets/scripts/'))
    .pipe(browserSync.reload({stream:true}))
});

目前,我注意到停止工作的脚本是 lighcase.js(灯箱)、jquery.matchHeight.js(匹配列高)和 slick.js(滑块)。

编辑:我的控制台上没有错误。只有消息“JQMIGRATE: Migrate is installed, version 3.0.0”。

任何帮助将不胜感激。在试图找到这个问题背后的逻辑一周后,我放弃了哈哈。帮助一个菜鸟!

【问题讨论】:

  • 那么,他们会默默地“停止工作”吗?或者可能是控制台中抛出了一些错误?
  • 我控制台上的唯一消息是:JQMIGRATE: Migrate 已安装,版本 3.0.0。但没有红色错误警报。
  • 好吧,验证您的脚本是否正在加载。然后在入口点设置断点等。
  • 感谢您的回答 matmo。你会如何用 noobish 翻译“在入口点设置断点”?
  • “我可能必须按特定顺序连接文件” - 您肯定必须按特定顺序连接文件,假设任何这些文件依赖于任何其他文件(例如,库 X 插件必须在库 X 核心之后)。如果您以与使用单个 &lt;script&gt; 标记时包含它们的顺序相同的顺序连接它们,它应该可以工作。

标签: javascript gulp concatenation


【解决方案1】:

要调试的工作太多,只有我的 global.js 路径在我的 gulpfile 任务中出错。

'assets/scripts/plugins/global.js'

应该是:

'assets/scripts/base/global.js'

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2022-01-26
    • 2015-12-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多