'Module not found: Error: Can't resolve` when use a mixin and require on same file

[felipefialho]

Hi, I tried help here (pugjs/pug#3164) before.

---

Pug Version: 2.0.4

Node Version: v11.10.0

Input JavaScript Values

new HtmlWebpackPlugin({  
  hash: true, 
  template: './src/index.pug'
}),

Input Pug

- var css = require('./person-css.json');
- var variables = require('../../variables.json');

mixin person(image, subtitle, link)
  h1(class=css.title) 

- var css = require('./section-css.json');
include ../person/person

section(class=css.host)
  +person('Person')

Additional Comments

If I remove mixin, require works fine and compile as expected. But when I used mixin I get the follows errors:

ERROR in ./src/index.pug (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.pug)
    Module not found: Error: Can't resolve '../../variables.json' in 'my-project/src'
     @ ./src/index.pug (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.pug) 7:16-47
    
ERROR in ./src/index.pug (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.pug)
    Module not found: Error: Can't resolve './person-css.json' in 'my-project/src'
     @ ./src/index.pug (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.pug) 6:10-38

Maybe this is an issue for pug-loader.

Thanks!

[modgera]

I have a similar problem, but with images. As a temporary solution, I create a new .pug template with "require" part. Then, I included this new file into the file with mixin.
Smth like that:
img.pug

img(src=require("./image.png"))

mix.pug

mixin mix(data)
    div Some Text
    include img.pug

index.pug

div Some Title
    include mix
    +mix('some data')

[webdiscus]

may be a bit later, but...
I had same problem by include a template like follow from a sub directory:

include mixins
img(src=require('./image.jpeg'))

This issue is fixed in the alternative pug-loader

[RushiBShah]

You can simply do:
npm install pug-loader
npm install pug