我以Vuejs为前端和Scala作为后端开发Web应用程序。
当我为生产模式准备应用程序时,我运行:
npm Run Build& SBT编译阶段
,然后从SBT开始生产模式。我有以下问题。
在iOS中,全屏(PWA)不再可能。但是在开发模式下已经有可能。
我的索引。 HTML看起来像这样:
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta content="minimum-scale=1,width=device-width,maximum-scale=1,user-scalable=no" name="viewport"><!--[if IE]><link rel="icon" href="./logo_klein.jpg"><![endif]-->
<title>EXAMPLE</title>
<link href="./static/css/app.f87699ad.css" rel="preload" as="style">
<link href="./static/css/chunk-vendors.5c682f89.css" rel="preload" as="style">
<link href="./static/js/app.7150a234.js" rel="preload" as="script">
<link href="./static/js/chunk-vendors.be075eb5.js" rel="preload" as="script">
<link href="./static/css/chunk-vendors.5c682f89.css" rel="stylesheet">
<link href="./static/css/app.f87699ad.css" rel="stylesheet">
<link rel="icon" type="image/png" sizes="32x32" href="./img/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./img/icons/favicon-16x16.png">
<!--<link rel="manifest" href="./manifest.json">-->
<meta name="theme-color" content="#4DBA87">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="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="hoScom">
<link rel="apple-touch-icon" href="./img/icons/apple-touch-icon-152x152.png">
<link rel="mask-icon" href="./img/icons/safari-pinned-tab.svg" color="#4DBA87">
<meta name="msapplication-TileImage" content="./img/icons/msapplication-icon-144x144.png">
<meta name="msapplication-TileColor" content="#000000">
<link rel="manifest" href="./manifest.json">
</head>
我的清单。 JSON,
{
"name":"EXAMPLE",
"short_name":"EX",
"start_url":"http://myUrl/",
"display":"standalone",
"scope":"http://myUrl/"
}
如果我删除了Maniffest。来自索引的JSON。 html我可以在将其添加到主屏幕中后启动全屏和独立的应用程序。
不幸的是,我需要清单文件,因为我必须将其授予start_url和范围。
有人知道这个问题并可以帮助我吗?
++ update ++
我现在发现,他无法阅读示例费,如您在屏幕截图上所见。控制台,应用程序窗口(Firefox)和我的文件夹结构有错误。

我导入清单时是错误的吗? PlayFramework可能是一个问题,还是绝对是前端问题?还是Vue Webpack的问题?
多谢!
I develop a web app with VueJs as frontend and playframework with SCALA as backend.
When I prepare the app for production mode, I run:
npm run build & sbt compile stage
and then start it with sbt start the production mode. I have the following problem.
In iOS, FullScreen (PWA) is no longer possible. But it was already possible in development mode.
My index. html looks like this:
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta content="minimum-scale=1,width=device-width,maximum-scale=1,user-scalable=no" name="viewport"><!--[if IE]><link rel="icon" href="./logo_klein.jpg"><![endif]-->
<title>EXAMPLE</title>
<link href="./static/css/app.f87699ad.css" rel="preload" as="style">
<link href="./static/css/chunk-vendors.5c682f89.css" rel="preload" as="style">
<link href="./static/js/app.7150a234.js" rel="preload" as="script">
<link href="./static/js/chunk-vendors.be075eb5.js" rel="preload" as="script">
<link href="./static/css/chunk-vendors.5c682f89.css" rel="stylesheet">
<link href="./static/css/app.f87699ad.css" rel="stylesheet">
<link rel="icon" type="image/png" sizes="32x32" href="./img/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./img/icons/favicon-16x16.png">
<!--<link rel="manifest" href="./manifest.json">-->
<meta name="theme-color" content="#4DBA87">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="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="hoScom">
<link rel="apple-touch-icon" href="./img/icons/apple-touch-icon-152x152.png">
<link rel="mask-icon" href="./img/icons/safari-pinned-tab.svg" color="#4DBA87">
<meta name="msapplication-TileImage" content="./img/icons/msapplication-icon-144x144.png">
<meta name="msapplication-TileColor" content="#000000">
<link rel="manifest" href="./manifest.json">
</head>
and my manifest. json so
{
"name":"EXAMPLE",
"short_name":"EX",
"start_url":"http://myUrl/",
"display":"standalone",
"scope":"http://myUrl/"
}
If I remove the maniffest. json from index. html I can start the app Fullscreen and Standalone once I have added it to the main screen.
Unfortunately I need the manifest file because I have to give it the start_url and scope.
Does anyone know the problem and can help me?
++UPDATE++
I found out now, he can not read the manifestfile, as you can see at the screenshot. There is the error in console, Application window (firefox) and my folder structure.

Is the way wrong as i import the manifest? Could it be a problem with the playframework, or is it definitely a frontend problem? Or maybe a problem from vue webpack?
Thanks a lot!
发布评论
评论(1)
使用
/
start_url
&amp;范围
;另外:清单。后者在规格之内,但iOS似乎更喜欢
.webmanifest。
Use
/
for yourStart_URL
&Scope
; also:manifest.webmanifest
notmanifest.json
. The latter is within spec, but iOS seems to prefer.webmanifest.