Vuejs webpack static folder not working in subfolder

Question

Can we have a relative static folder with webpack?

I created a Vuejs app which uses Webpack as the build tool. And the structure is like this, I put all images/video under static but js/css under assets:

The app works fine as long as the app is distributed as root.

i.e http://<domain>/index.html

But I'd like to distribute it under a sub folders and this same distribution code works without recompiling as it may be moved around by a different operation team.

i.e

http://<domain>/<app>/index.html
http://<domain>/<app>/index.html
http://<domain>/<app>/<app>/index.html

This messes up all the static resources. So I did some researches:

http://vuejs-templates.github.io/webpack/static.html

And play a bit with my setting assetsPublicPath, without being specific to a subfolder name, to ./ or "", but it didn't work.

assetsPublicPath: '/',

assetsSubDirectory: 'static'

Is there a way to pack the static folder so it works like a relative path or do I need to move all my resources to assets?

Thanks in advance.

I have a strong feeling that I am not using webpack in the intended way. Webpack also output everything in a static folder with absolute path. — Alocus
Show us your webpack config. Im using copyfiles webpack plugin and i create images and fonts folder, for instance (in my angular project) — Gerardo Rosciano

Shuliyey Shuliyey · Accepted Answer · 2017-08-20T00:56:14

happened to me today, i fixed this by remove node_modules, reinstall node_modules, shutdown, power on (reboot didn't work for me, i have to shutdown and power on)

I think there're some caching going on here. So best way to fix this is to reinstall node_modules and power off, then power on

also this might also help: https://github.com/vuejs-templates/webpack/issues/79

You said:

....., try upgrading vue-cli to the latest version and confirm that things are fixed with a fresh project?

Vuejs webpack static folder not working in subfolder

1 Answers