1

方法:使用 gulp 创建带有来自 mongodb 的帖子的静态 html

堆栈: : express, mongodb, pug, gulp

TL:DR 我有一个连接 mongodb 的 express 应用程序和一些显示在我的登录页面上的帖子。每台服务器一切正常,它也在生产环境中运行。但除此之外,我还想要我的登录页面的静态版本。我知道那里有很多花哨的静态站点生成器,但我是 gulp 的粉丝并希望它是手工制作的 =)

我有这个 gulptask,它已经将每个 MongoClient 连接到我的本地数据库(数据库:护照,集合:帖子)和 console.logs 我的帖子

我认为这不是办法,但我可以成功记录数据功能中的帖子

gulp.task('db-test', function() {
    return gulp.src('views/index.pug')
      .pipe(data(function(file, cb) {
        MongoClient.connect('mongodb://localhost:27017/passport', function(err, db) {
          db.collection('posts').find().forEach(function(doc) {
            console.log(doc) // This logs each of my posts from the mongodb - yayy but how to pass it correctly to the pug function below?
          });
          if(err) return cb(err);
          cb(undefined, db.collection('posts').find());
      });
    }))

    .pipe(pug({
    // here Im using a static array, otherwise the posts are not logged in the data function
      locals: {posts: [{title: "blabal"}, {title: "heyhey"}]}
    }))
    // If im doing like in the instruction of gulp-data, it breaks in my template 
    // .pipe(pug({}))
    .pipe(gulp.dest('./dist'))
});

模板

ul
  each val in posts
    li= val.title

当我删除这个动态部分时,gulp taks 会毫无问题地生成我的 html。

它应该如何工作的版本(但不是)

gulp.task('db-test', function() {
 return gulp.src('views/index.pug')
  .pipe(data(function(file, cb) {
     MongoClient.connect('mongodb://localhost:27017/passport', function(err, db) {
        if(err) return cb(err);
        cb(undefined, db.collection('posts').find());
      });
    }))
   .pipe(pug({})) // now my gulp-pug tasks says cannot find length of undefined = no posts found or just accessing the Cursor from the mongo collection - i dont know...
   .pipe(gulp.dest('./dist'))
});

当我调试我的 gulp 任务时,我看到这db.collection('posts').find()是一个未决的承诺。我也试图解决这个问题,但没有成功。

Gulp Heros 在那里 - 帮助我!

4

0 回答 0