我在/ var / www / html / testing中创建了一个新的(WebPack,Vue,Vuetify,PWA)项目:
vue init vuetifyjs/pwa myapp
cd myapp
yarn run dev
->在开发模式下一切都很好,可以在http:// localhost:8080中打开页面
生产版本:
yarn run build
->确定,创建并填充dist文件夹:
/var/www/html/testing/myapp/dist
我的ngninx服务器的WebRoot是/ var / www / html,因此我尝试使用以下URL打开产品版本:
http://localhost/testing/myapp/dist/
问题:由于所有路径都是绝对路径,例如在index.html中,因此无法在浏览器中打开该应用程序:
<link rel=icon type=image/png sizes=32x32 href=/static/img/icons/favicon-32x32.png>
<link rel=manifest href=/static/manifest.json>
<link rel=preload href=/static/js/vendor.1c719443f0f3c271d7fd.js as=script>
等等。
在manifest.json中,还有一个绝对路径:
"start_url": "/index.html"
将我的WebRoot更改为
/var/www/html/testing/myapp/dist
一切都按预期进行。但这不是一个选择。目标文件夹不是WebRoot,而是某些子文件夹。
我的猜测:某些配置文件中的一个或多个更改应该可以解决问题。
问:我该如何解决?
(是的,我已经浏览了myapp,myapp / build,myapp / config中的许多配置文件,但是我真的看不到必须更改哪个文件/设置。)
顺便说一句:有23478个文件,但没有'webpack.config.js',我发现了这些文件:
ls config/
dev.env.js index.js prod.env.js test.env.js
ls build/
build.js service-worker-dev.js webpack.dev.conf.js
check-versions.js service-worker-prod.js webpack.prod.conf.js
dev-client.js utils.js webpack.test.conf.js
dev-server.js vue-loader.conf.js
load-minified.js webpack.base.conf.js
还有一个问题:为什么绝对路径仍然是默认路径?相对路径应该可以正常工作。很有可能是有原因的,但我看不到。
首先:RTFM。
然后在:
config/index.js
更改assetsPublicPath:
...
// assetsPublicPath: '/',
assetsPublicPath: './',
...
此assetPublicPath在其他配置文件中用于创建publicPath。
请注意:这里有类似Ferrybig的警告和其他警告:https : //github.com/vuejs-templates/webpack/issues/200:
如果将publicPath设为相对,则vue将无法处理“代码拆分”(可能是这样)和“拆分块”(无论可能是什么)
但是:到目前为止,尚未发现任何恶意副作用-手指交叉。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句