First, please forgive me for being a newb and let me know what I can improve to get help here.
tl:dr; Everything is working as expected, except pug's extends/block functionality. The same content can be successfully imported using include, but as soon as the call is changed to a block, the partial is no longer registered in webpack's CLI (forgive my lack of jargon knowledge here), and no content is rendered to the page.
This is the case whether the partial is in the same directory or in a child directory of index.pug. I'd prefer to use a child directory, which is why I've formatted the example below.
Ok, so...
I have a folder structure like:
- src
- webpackConfig.js
- html
- index.pug
- partials
- some-partial.pug
webpackConfig.js (excerpt)
module.exports = {
entry: {
app: path.resolve(__dirname, 'src', 'index.js'),
},
plugins: [
new CleanWebpackPlugin(['dist']),
new HtmlWebpackPlugin({
filename: 'index.html',
title: 'Site',
template: 'src/html/index.pug',
inject: true
}),
new webpack.HotModuleReplacementPlugin(),
new MiniCssExtractPlugin({
filename: devMode ? '[name].css' : '[name].[hash].css',
chunkFilename: devMode ? '[id].css' : '[id].[hash].css',
}),
],
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].bundle.js'
},
module {
rules: [{
test: /\.pug$/,
use: [{
loader: 'pug-loader',
options: {
pretty: true,
// root: path.resolve(__dirname, 'src/html')
}
}]
}]
}
index.pug
include partials/header
block some-partial
partials/some-partial.pug
extends /../../index.pug
block some-partial
p I'm some text.
* Note here: I've tried several versions of the index.pug directory format, both with some-partial.pug in the same directory and child, to no avail.
I'm stumped. Everything I've read online says this should just...work. And when all other functionality works as intended, I'm a bit at a loss.
I have been having issues with relative paths while importing images/local fonts, so I was thinking it's something to do with how the Pug file is seeing the directory tree? (If that makes sense) But then why does "include" still work?
Any and all help/clues much appreciated!