NativeScript Webview新手问题

问题描述 投票:0回答:1

我正在尝试使用NativeScript来加快将现有Android应用移植到iOS的过程。有问题的应用程序在Cordova Webview中使用了大量的SVG操作。为简单起见,我想将所有现有的Webview辅助代码(实质上是整个现有的Cordova www文件夹及其内容)移植到新的NativeScript应用程序中。 WebView与自定义的Cordova插件进行对话,我使用该插件与服务器对话来完成诸如显示新的SVG,跟踪用户操作等操作。

如果我解决了这些棘手的问题,我正在考虑使用this component在当前的Webview JS代码和新的NativeScript后端之间实现双向通信,该后端将替换当前的Cordova插件。这里一定有人告诉我,我不需要这样做。但是,这样做将意味着把婴儿扔掉,并重写我当前所有的Webview ES6 / JS / CSS代码。

这对我来说,使用NativeScript差不多是第一天,我遇到了一些问题。

  • 即使我遵循instructions here并将操作栏设置为隐藏,我仍无法摆脱ActionBar。
  • [我可以在home.component.html中使用以下标记

以显示外部Web内容。但是,我真正想做的是显示以下文件夹层次结构中www文件夹中的本地HTML文件

app
|
 ____home
|
 ____www
      |
       ______ index.html
      |
       ______css
      |
       ______ tpl
      |
       .....

但是,当我使用标记时

<Page actionBarHidden="true" >
 <WebView src="~/www/index.html"></WebView>
</Page>

向我显示错误消息

[file:///data/data/com.example.myapp/files/app/www/index.html上的网页不可用。

我将非常感谢任何能够在这里告诉我我做错了什么的人,以及我如何摆脱当前显示应用程序标题的操作栏。

webview nativescript
1个回答
0
投票

您的本地HTML文件是否被Webpack识别(在NativeScript中默认启用)?尝试将本地HTML文件显式添加到您的webpack.config.js文件。这样,Webpack将“知道”它也必须捆绑此文件。

new CopyWebpackPlugin([
    { from: { glob: "<path-to-your-custom-file-here>/index.html" } }, // HERE
    { from: { glob: "fonts/**" } },
    { from: { glob: "**/*.jpg" } },
    { from: { glob: "**/*.png" } },
]

示例here

© www.soinside.com 2019 - 2024. All rights reserved.