我正在使用 nextJS 版本“10.0.9”和 next-pwa 版本“^5.0.6”,它们一起工作得很好,我的应用程序无法满足,但由于某些原因,我需要为所有路由添加前缀,所以我添加“basePath”属性并在 next.config.js 文件中将其设置为“/recharge-cards”,但之后我的应用程序变得可卸载,我尝试了很多方法,将范围和 subdomainPrefix 更改为“/recharge-cards”并更改我的 _document.js 上的文件路径,但似乎没有任何效果。
下面你会找到我的文件,所以帮我解决这个问题
清单.json
{
"name": "next-pwa",
"short_name": "next-pwa",
"display": "standalone",
"orientation": "portrait",
"theme_color": "#FFFFFF",
"background_color": "#FFFFFF",
"start_url": "/recharge-cards",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
next.config.js
const withPWA = require('next-pwa');
module.exports = withPWA({
basePath: "recharge-cards",
pwa: {
dest: 'public',
},
});
_document.js(头部)
<Head>
<meta name='application-name' content={APP_NAME} />
<meta name='apple-mobile-web-app-capable' content='yes' />
<meta name='apple-mobile-web-app-status-bar-style' content='default' />
<meta name='apple-mobile-web-app-title' content={APP_NAME} />
<meta name='description' content={APP_DESCRIPTION} />
<meta name='format-detection' content='telephone=no' />
<meta name='mobile-web-app-capable' content='yes' />
<meta name='theme-color' content='#FFFFFF' />
<link rel='apple-touch-icon' sizes='180x180' href='/apple-touch-icon.png' />
<link rel='manifest' href='/manifest.json' />
<link rel='shortcut icon' href='/favicon.ico' />
</Head>
项目文件