方法:使用 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 在那里 - 帮助我!