Question

我有一个带有Webview的新Nativescript项目（常规，不带vue），我的html和代码在我的应用程序内部，而不是指向URL的实际链接，因此我可以轻松地在设备和webview之间进行通信。

我的目标是传输使用VueJS的laravel应用程序的前端文件（html刀片和一些vue组件）。首先，我想创建一个index.html文件，在其中我这样调用我的主要组件：

<div id="root">    
    <LeafletMap></LeafletMap>
</div>

但是我很快意识到它不起作用，因为未为浏览器定义require（）和import，这意味着我什至根本无法从node_modules导入vue，我需要将所有内容捆绑到一个像我这样的javascript文件中laravel项目可以，但是我无法弄清楚这一切，特别是因为Vue似乎有它自己的先决条件，例如vue-loader等。

起初我尝试使用 tns run android --bundle 运行项目，因为我发现它可以捆绑所有内容...但是我还没有找到一个告诉我捆绑文件在哪里的链接结束于是，所以我将其放在我的html脚本中，即使这样，我什至也不确定它是否可以按我设置的方式工作。使用-bundle

时出现以下错误

WARNING in ./node_modules/vue/src/platforms/weex/compiler/modules/recycle-list/component-root.js 7:4
Module parse failed: Unexpected token (7:4)
You may need an appropriate loader to handle this file type.
| // mark component root nodes as
| export function postTransformComponentRoot (
>   el: ASTElement,
|   options: WeexCompilerOptions
| ) {
 @ . sync (root|page)\.(xml|css|js|ts|scss)$ vue/src/platforms/weex/compiler/modules/recycle-list/component-root.js
 @ ./app.js

ERROR in ./node_modules/mkdirp/test/root.js
Module not found: Error: Can't resolve 'tap' in 'C:\git\testWebvie\app\node_modules\mkdirp\test'
 @ ./node_modules/mkdirp/test/root.js 4:11-25
 @ . sync (root|page)\.(xml|css|js|ts|scss)$
 @ ./app.js

如果使用--bundle不能解决问题，我不介意在运行 tns run android 的顶部为我的应用文件夹设置 npm run watch 命令，虽然那是个小麻烦。.

Nativescript：如何捆绑我的Webview代码？

0 个答案: