Node.js+Express+EJS如何配置多视图路径实现路由对应多文件夹模板渲染

Express 4.10及以上版本原生支持多视图目录配置，你可以根据自己的场景选择以下两种方案：

方案1：全局配置多视图目录（适合无模板重名场景） #

直接给views配置传入路径数组，渲染模板时Express会按数组顺序依次查找对应文件：

const path = require('path')
const express = require('express')
const app = express()

// 按优先级填入所有视图目录
app.set('views', [
  path.join(__dirname, 'views/default'), // 普通页面视图目录
  path.join(__dirname, 'views/admin') // 管理后台视图目录
])
app.set('view engine', 'ejs')

// 渲染时直接写模板文件名即可
app.get('/admin/dashboard', (req, res) => {
  res.render('dashboard') // 优先找default目录下的dashboard.ejs，找不到再找admin目录下的
})

注意：如果多个目录下存在同名模板，会优先渲染数组中排序靠前的目录下的文件，不适合路由严格隔离的场景。

方案2：路由级绑定独立视图目录（推荐，适合按路由拆分场景） #

如果需要/admin前缀的路由完全从独立的视图目录加载，避免重名冲突，可以在路由层级单独修改视图配置：

1. 先拆分路由模块，示例routes/admin.js代码：

const express = require('express')
const path = require('path')
const router = express.Router()

// 给当前admin路由组单独绑定视图目录，优先级高于全局配置
router.use((req, res, next) => {
  req.app.set('views', path.join(__dirname, '../views/admin'))
  next()
})

// 后续所有admin路由的render方法都会从admin目录查找模板
router.get('/dashboard', (req, res) => {
  res.render('dashboard') // 直接渲染views/admin/dashboard.ejs
})

module.exports = router

2. 主入口app.js挂载路由：

const adminRouter = require('./routes/admin')
const homeRouter = require('./routes/home')

// 普通路由绑定默认视图目录
app.use('/', (req, res, next) => {
  req.app.set('views', path.join(__dirname, 'views/default'))
  next()
}, homeRouter)

// 管理后台路由绑定独立视图目录
app.use('/admin', adminRouter)

常见报错排查 #

• 出现Failed to lookup view错误时，可在render方法前添加console.log(app.get('views'))确认路径指向是否正确
• 检查是否已安装EJS依赖：npm i ejs
• 确认模板文件后缀为.ejs，文件名大小写匹配

内容的提问来源于stack exchange，提问作者abdeljalil khalal