Angularjs 使用文件夹结构在大型Express应用程序中渲染所有Jade文件?
如何配置Express以呈现所有Jade文件,而不考虑路径?我使用的应用程序很大,结构非常复杂。我正在成功地为静态文件提供服务,但是我需要渲染其中的许多文件。我们正在为所有需要标记的文件使用Jade 我担心下面的模式会迫使我为每个包含Jade文件的文件夹创建路由别名。。。那就太糟糕了。我想告诉Express使用.jade扩展来简单地渲染所有内容。。。或允许我为根创建一个路由前缀,该前缀将导致渲染操作而不是静态操作Angularjs 使用文件夹结构在大型Express应用程序中渲染所有Jade文件?,angularjs,express,pug,Angularjs,Express,Pug,如何配置Express以呈现所有Jade文件,而不考虑路径?我使用的应用程序很大,结构非常复杂。我正在成功地为静态文件提供服务,但是我需要渲染其中的许多文件。我们正在为所有需要标记的文件使用Jade 我担心下面的模式会迫使我为每个包含Jade文件的文件夹创建路由别名。。。那就太糟糕了。我想告诉Express使用.jade扩展来简单地渲染所有内容。。。或允许我为根创建一个路由前缀,该前缀将导致渲染操作而不是静态操作 client app services modules
client
app
services
modules
moduleA
itemA
itemAList.jade
itemAList.js
itemADetails.jade
itemADetails.js
itemB
itemBList.jade
itemBList.js
itemBDetails.jade
itemBDetails.js
moduleB
itemC
itemCList.jade
itemCList.js
itemCDetails.jade
itemCDetails.js
itemD
itemDList.jade
itemDList.js
itemDDetails.jade
itemDDetails.js
assets
js
css
server
config
views
Routes.Config.js
module.exports = function(app){
app.get('/*', function(req, res){
res.render('../../client/' + req.params[0]);
});
app.get('/', function(req, res){
res.render('../../client/index', {});
})
}
[snip]
app.use(express.static(path.join(constants.rootPath, '/client')));
Express.Config.js
module.exports = function(app){
app.get('/*', function(req, res){
res.render('../../client/' + req.params[0]);
});
app.get('/', function(req, res){
res.render('../../client/index', {});
})
}
[snip]
app.use(express.static(path.join(constants.rootPath, '/client')));
我会在创建或保存.jade文件时使用Grunt文件监视程序启动编译。通过使用下面的
grunfile.js
,您可以发出命令grunt watch
,并在后台自动执行此操作:
module.exports = function(grunt){
grunt.initConfig({
jade: {
compile: {
options: {
client: false,
pretty: true
},
files: [{
cwd: "client/app/templates",
src: "**/*.jade",
dest: "client/app/modules",
ext: ".html",
expand: true
}]
}
},
watch: {
html: {
files: 'client/app/templates/**/*.jade',
tasks: ['jade'],
options: {
atBegin: true,
interrupt: true
}
}
}
});
grunt.loadNpmTasks("grunt-contrib-jade");
grunt.loadNpmTasks("grunt-contrib-watch");
grunt.registerTask('default', ['jade']);
}
现在,假设您将创建一个与“modules”文件夹平行的“templates”文件夹,并将所有.jade文件放在您想要的结构中。然后,您可以像往常一样将控制器和其他.js文件添加到模块文件夹结构中
我不确定当源和目标都指向同一个文件夹时,Grunt的行为如何。但是,如果您确实想将.jade和.html文件保存在同一文件夹中,或者不想创建“模板”结构,则只需将cwd
变量更改为指向“模块”文件夹:
注意:听起来你误解了一些基本原理。据我所知,在一个典型的MEAN应用程序中,通常有一个纯静态的文件夹结构。在您的示例中,这将是您的“客户机”文件夹。通过指定特殊路线,您可以单独决定如何处理其他每个案例。上面的例子是为了在保持“静态”区域的目的的同时实现我认为您所要求的 更新:不要使用相同的文件夹
我返回并尝试对源和目标使用相同的文件夹。这导致格朗特被绞死,无法逃脱。当它们不同时,不会发生此挂起。因此,将文件原样与“模板”文件夹一起使用