Pathing issue for prod build

[yodnoralov]

I have a static html page that needs to load the built css and js. Running npm run start loads all proper resource, however when building the prod script,npm run build, all resources (js, css, images) cannot be found. The app builds with no errors and I see all the dist files. It seems that there is an issue with my pathing configuration -- the html references /js/script.js instead of js/scripts.js.

Would you have any pointers?

[yodnoralov]

Updating publicPath from "/" to "" seemed to have fixed the pathing, but then I get these errors. My basic JS and CSS are still missing. The only thing I have in my js file is a console log so I think this is an issue with the build, not caused by the js code.

[ooxi]

Could you show how those paths look if you build dev? The URL are looking quite strange

[shin1mk]

hi, in html we added picture via <%=require ('./images/picture')%> but how to add image via scss?

[webdiscus]

@shin1mk

you can try to use the modern fork.

Using this fork you can:

• specify source image file in a template like <img src="@/images/example.png"> using a webpack alias (@ is alias to src/) or use a relative path to the image in src <img src="../images/webpack-logo.svg">
• specify source image file in a SCSS/CSS file like background-image: url('@/images/example.png'); or background-image: url('../images/example.png');

The new html-bundler-webpack-plugin resolves all source assets in a template or SCSS.