Vishal0203/file-include-webpack-plugin

Partial inside partial doesn't work

Closed this issue · 4 comments

Hi,
I was happy to read that the plugin supports partials inside partials.
Could you maybe provide an example for that?

I somehow can't manage to get it done, the paths won't resolve.

(For test purposes) I put both partials in the same folder, one below the main index.html:

index.html
/partials/partial1.html
/partials/partial2.html

index.html:
...
@@include('./partials/partial1.html')
...

partial1.html:
...
@@include('./partial2.html')
...

---> resolves as src/partial2.html (not found)

If I include the second partial via @@include('./partials/partial2.html'):
--> resolves as src/partials/partials/partial2.html (not found)

The first partial works fine.

Is this a bug or do I just not get it right? A code example would be great! 👍

@besing Hi, thanks for trying the library out. I've been busy with my day job. I'll take a look at this and update this issue.

@besing @DimNS @davidzoli

src/
------index.html
------/partials/partial1.html
------/partials/partial2.html

Based on the directory structure provided, I'm assuming that the plugin webpack configuration is as below:

new FileIncludeWebpackPlugin({ source: './src' })

The plugin tries to process all the files present In the mentioned source and performs substitution and copies to the destination. For this directory structure, the partials are also taken into consideration, hence causing failures. Ideally, partials are not supposed to be processed as we do not want the partials to be present in our dist or output

The right directory structure would be something like

src/
------/partials/partail1.html
------/partials/partial2.html
------/templates/index.html

where the source parameter is ./src/templates. Once you make this change, the following configuration will work. Please give it a try.

index.html:
@@include('./partials/partial1.html')

partial1.html:
@@include('./partial2.html')

I hope that explains.
I'll add this to the documentation as well. Thanks for pointing out.

Please let me know your suggestions on this.

There is a problem with the utils.getFileRoot(partialFile) call at line 34.

const partialPathContext = utils.getFileRoot(partialFile)

partialPathContext will be null when called with @@include('./partial2.html') so there won't be context for the call of processFile() in the partial's include.

To fix that I've replaced the utils function to path.dirname() and now it seems to compile successfully.
Please check out pull request: #19

PR is merged. Resolving.