打包后竟需要server才有效

Question

用 vue-cli webpack 做好了一个 webapp，打包成了安卓 app，但是发现运行后全部空白。过了几个月后才明白原来是需要 http-server 或者之类的 服务器才可以。any idea?

Answer 1

请问『过了几个月后才明白』，你是怎么等这几个月的。

这个应该无解吧，因为打包后很明确告诉了你：

Tip: built files are meant to be served over an HTTP server.
Opening index.html over file:// won't work.

Answer 2

打包以后全部空白，需要挂载在http服务器上，是因为里面的JS/CSS以及其他资源文件的路径都是默认从根目录执行的，也就是/开头的路径。因此，对于直接打开的文件，/表示的是磁盘根目录，所以是无法正确加载JS/CSS和其他资源文件的，也就无法正常显示页面了。

解决方法是，在webpack的打包配置中，将config\index.js中build部分的assetsPublicPath: '/'改为assetsPublicPath: './'，即可使用相对路径加载JS/CSS和其他资源文件，也就不会存在根目录指向磁盘根目录的情况，也就可以正常加载资源了。