HTML files in subfolders do not get styles / scripts.

[Andrew1431]

Describe the bug
In your documentation, it clearly states:

You may add as many html pages as you’d like to the root level directory, they will automatically be copied and minified into the dist/ folder upon building your site.

So I don't know if this a bug report or a feature request:

I want users to be able to visit website.com/survey instead of survey.html so I've put a survey/index.html file there. It works technically, I see the HTML, but it is not receiving any of the styles or javascript code injection.

To Reproduce
Steps to reproduce the behavior:

1. Create a subfolder for HTML (Very standard operation I assume?)
2. HTML inside there will load but it will not get the webpack injections or live reload.

Expected behavior
I expect to be able to nest my HTML for cleaner URLs

Desktop (please complete the following information):
Platform Agnostic

[CharnjeetIotasol]

Have you found any way to load style and script on subfolder.

[kesavanv]

You will be able to organize HTML files in folders, by adding the below code

filename = dir.substring(6);
in https://github.com/ericalli/static-site-boilerplate/blob/master/config/webpack.plugins.js#L60

Can be done better, if we alter the actual code.

[redordev]

Would be great if we could have different directories and root level pages e.g.

contact.html
index.html
insights.html
service.html
team.html
blog/story1.html
blog/story2.html
insights/insight1.html
insights/insight2.html
services/service1.html
services/service2.html
team/member1.html
team/member2.html

Any idea how to change the script to do this?

[BenceSzalai]

All you need to do is modify webpack.plugins.js to instead of using path.basename(dir) which throws away the directory path, extract the html "filename" from dir including the relative path compared to src. Something like:

const filename = path.relative(config.paths.src, dir);

Actually this could be updated in the repo, as it would be more versatile.

Together with changing line 58 as:

const generateHTMLPlugins = () => glob.sync(`./${config.paths.src}/**/*.html`).map((dir) => {

which would allow the src path to be properly modified here, but that is not directly related to this issue, just saying, as once config.paths.src is being used to generate the relative filenames it'd be preferable to use that to gather the files as well instead of hardcoded src as of now.