4

I have an Express app using Pug templates and Parcel for my bundler. According to the Parcel docs, I can have a config file that stores my locals pug.config.js, however, I need to dynamically add locals to my templates at runtime. Is it possible to do this?

Here are my files:

index.pug

...
h1 #{isAuthenticated}
h1 #{env}
...

pug.config.js

module.exports = {
  locals: {
    env: process.env.NODE_ENV
  }
}

app.js

const Bundler = require('parcel-bundler')
const bundler = new Bundler(path.resolve(__dirname, 'views/index.pug'))

app
.set('views', path.join(__dirname, 'views'))
.set('view engine', 'pug')
.use(function(req, res, next) {
     res.locals.isAuthenticated = 'true'
     next()
})
.use(bundler.middleware())

Here I am attempting to set a locals var isAuthenticated to 'true', however when rendering index.pug the variable is empty, meanwhile, the env var from my pug.config.js file is present.

Now, if I try to render a page in my controller functions with res.render('index', {isAuthenticated: 'true'}) the variable isAuthenticated is now present, however env is empty.

I'm wondering if I am missing something here or if this works as expected?

McLovin
  • 1,139
  • 3
  • 15
  • 30

1 Answers1

6

I have briefly tried out parcel. The out of box experience is awesome, but when it comes to advanced configuration, it's terrible. That's kinda by design, parcel just oppose the idea of config. Everything bases on convention.

So i check the source code. Turns out parcel only takes pug config from '.pugrc', '.pugrc.js', 'pug.config.js'.

If you choose to stick with parcel way, you can try write your locals value back to one of these files on disk. Need to test it out, might have some async problems to debug.

I personally prefer following method. You use pug as a real template engine, directly use the pug.compile/render API to produce html. You then pipe these html further to parcel, it'll still do the "bundling" part of the job.

hackape
  • 11,966
  • 1
  • 15
  • 40