Multiline-Variablen in Jade (ex-Pug)

Question

Ist es möglich, es zu verwenden? Zum Beispiel hier:

- var movieList = [{title: "Ocean's Eleven", rating: 9.2}, {title: "Pirates of the Caribbean", rating: 9.7}]; 

mixin movie-card(movie) 
    h2.movie-title= movie.title 
    div.rating 
    p= movie.rating 

for movie in movieList 
    +movie-card(movie) 

Ich will nicht - am Anfang jeder Zeile verwenden. Wenn es nicht möglich ist, gibt es vielleicht eine Möglichkeit, mehrzeilige JSON-Datei zu importieren?

Answer 1

Sie können JSON-Daten während compile mit LOCALS (Jade) oder DATA (Pug) importieren. Dies ist, wie ich es über gulpjs und Pug, movieList würde Daten in der gulpfile.js und songs.json würde eine externe Datei sein. Es ist nicht von Ihnen Codebeispiel klar, wenn Sie einen Task-Manager oder Express verwenden, etc ...

gulpfile.js

var fs = require('fs'), 
    gulp = require('gulp'), 
    pug = require('gulp-pug'), 
    movieList = [{title: "Ocean's Eleven", rating: 9.2}, {title: "Pirates of the Caribbean", rating: 9.7}]; 

gulp.task('markup', function() { 
    gulp.src('./markup/*.pug') 
    .pipe(pug({ 
     data: { 
     // in Jade, this would be "locals: {" 
     "movies": movieList, 
     "music": JSON.parse(fs.readFileSync('./songs.json', { encoding: 'utf8' })) 
     } 
    ) 
    .pipe(gulp.dest('../')) 
    }); 
}); 

und in der Mops Vorlage

- var movieList = locals['movies'] // assuming this will eventually be "= data['movies']" 
- var musicList = locals['music'] // assuming this will eventually be "= data['music']" 

mixin movie-card(movie) 
    h2.movie-title= movie.title 
    div.rating 
    p= movie.rating 

for movie in movieList 
    +movie-card(movie) 

mixin song-card(song) 
    h2.song-title #{song.title} 
    div.rating 
    p #{song.rating} 

for song in musicList 
    +song-card(song)