Html-webpack-plugin: Pug locals compilation

Created on 27 Apr 2017 · 3Comments · Source: jantimon/html-webpack-plugin

Hello, I have a problem. I need to compile and include another file passed by function.

// example #1
// index.jade
// I'm using bemto
mixin foo()
  - var blockName = 'some-block' // simplified example
  +b.some-block
    != getBlock(blockName)
+foo()

// some-block.pug
+e.element Some text

// webpack.config.js
use: [
  'html-loader', // without it shows an error
  {
    loader: "pug-html-loader",
    options: {
      data: {
        getBlock: function(blockName) {
          return fs.readFileSync(`${blockName}.pug`, { encoding: 'utf8' });
        },
      }
    }
  }
]
new HtmlWebpackPlugin({
  filename: index.html,
  template: index.pug
})

// example #2
// index.jade
// I'm using bemto
mixin foo()
  - var blockName = 'some-block' // simplified example
  +b.some-block
    != htmlWebpackPlugin.options.getBlock(blockName)
+foo()

// some-block.pug
+e.element Some text

// webpack.config.js
use: {
 loader: 'pug-loader',
}
new HtmlWebpackPlugin({
  filename: index.html,
  template: index.pug
  getBlock: function(blockName) {
    return fs.readFileSync(`${blockName}.pug`, { encoding: 'utf8' });
  },
})



md5-2c196e6fc044a7132a0dc0394964c650



// index.html


md5-b28215b06c63a16c83c0c49502103358

Is this possible? I would be grateful if you help.

Source