Mẫu được biên dịch sẵn với phiên bản Handlebars cũ hơn thời gian chạy hiện tại

Question

Tôi gặp lỗi này, nhưng khác nhau giữa this question và câu hỏi của tôi là tôi đang sử dụng gulp thay vì grunt.

Trước tiên, thời gian chạy trên tay lái của tôi là handlebars v4.0.5 (tệp js).

Kết quả của handlebar -v là 4.0.5

Đây là gulpfile.js tôi:

var gulp = require('gulp'); 
var uglify = require('gulp-uglify'); 
var handlebars = require('gulp-handlebars'); 
var wrap = require('gulp-wrap'); 
var declare = require('gulp-declare'); 
var concat = require('gulp-concat'); 

gulp.task('default', ['templates','scripts'], function() { 

}); 

gulp.task('templates', function() { 
    gulp.src('templates/*.hbs') 
     .pipe(handlebars()) 
     .pipe(wrap('Handlebars.template(<%= contents %>)')) 
     .pipe(declare({ 
      namespace: 'MyApp.templates', 
      noRedeclare: true, // Avoid duplicate declarations 
     })) 
     .pipe(concat('templates.js')) 
     .pipe(gulp.dest('js/dist')); 
}); 

gulp.task('scripts', function() { 
    return gulp.src([ 
    'bower_components/handlebars/handlebars.runtime.js', 
    'bower_components/jquery/dist/jquery.js', 
    'bower_components/bootstrap/dist/bootstrap.js',  
    'js/dist/templates.js', 
    'js/main.js']) 
     .pipe(concat('bundle.js')) 
     .pipe(uglify()) 
     .pipe(gulp.dest('js/dist/')); 
}); 

Main.js

"use strict"; 
var data = { title: 'This Form', name: 'Joey' }; 
var html = MyApp.templates.hellotemplate(data); 
// console.log(html); 

$(document).ready(function() { 
    $('#dynamic-content').html(html); 
}); 

đâu có thể là vấn đề của tôi?

Lỗi:

Uncaught Error: Template was precompiled with an older version of Handlebars than the current runtime. Please update your precompiler to a newer version (>= 4.0.0) or downgrade your runtime to an older version (>= 2.0.0-beta.1).

tôi đã biên dịch sẵn các mẫu sử dụng ngụm lệnh.

Cảm ơn bạn rất nhiều !!

Answer 1

Có một cách tốt hơn để biên dịch một mẫu sử dụng một phiên bản cụ thể của tay lái mà được bao phủ trong README: https://github.com/lazd/gulp-handlebars#compiling-using-a-specific-handlebars-version

Hãy chắc chắn rằng bạn đã chỉ định phiên bản tay lái trong package.json tập tin của ứng dụng của bạn:

{ 
    "devDependencies": { 
    "handlebars": "^4.0.5" 
    } 
} 

Sau đó, đòi hỏi tay lái bằng cách đi qua nó như là một tùy chọn ngụm-tay lái trong gulpfile của bạn:

gulp.task('templates', function() { 
    gulp.src('templates/*.hbs') 
    .pipe(handlebars({ 
     handlebars: require('handlebars') 
    })) 
    .pipe(wrap('Handlebars.template(<%= contents %>)')) 
    .pipe(declare({ 
     namespace: 'MyApp.templates', 
     noRedeclare: true, // Avoid duplicate declarations 
    })) 
    .pipe(concat('templates.js')) 
    .pipe(gulp.dest('js/dist')); 
}); 

Answer 2

Ok, sự cố của tôi nằm trong gói gulp-handlebars vì trong trình tải gói, nó đang tải phiên bản phụ.

Tôi cập nhật thủ công và tôi đã giải quyết được sự cố của mình. Tới node_modules thư mục, tìm ngụm-tay lái thư mục, mở package.json, và cập nhật các dependicies như thế này:

"dependencies": { 
    "gulp-util": "^3.0.4", 
    "handlebars": "4.0.5", 
    "through2": "^0.6.3" 
    }