如何在现有的nuxt.js项目周围包装cordova？

Question

我有一个现有的nuxt.js项目。现在，我想为Android和IOS部署我的代码，因此我想使用Cordova。

我做了很多研究，但找不到解决方案。我发现一个插件https://github.com/m0dch3n/vue-cli-plugin-cordova似乎可以完成工作。我安装它并运行“ npm run cordova-serve-android”，但它给了我这个错误：

This relative module was not found:

* ./src/main.js in multi (webpack)-dev-server/client?http://192.168.0.28:8080/sockjs-node 
(webpack)/hot/dev-server.js 
./src/main.js, multi (webpack)-dev-server/client?http://localhost (webpack)/hot/dev-server.js 
(webpack)-dev-server/client?http://192.168.0.28:8080/sockjs-node ./src/main.js

不幸的是，github插件页面上的Nuxt并没有一个单一的问题，因此我认为该插件不适用于Nuxt。是否有与Nuxt兼容的教程或插件？

Answer 1

我制作了一个示例存储库，试图找到错误，您可以使用它作为示例。基本上你将这些东西添加到你的 nuxt 配置中

mode: 'spa',
generate: {
    dir: 'www',
},
build: {
   publicPath: '/android_asset/www/front-end',
},
scripts: [
  {
    src: '/cordova.js',
    type: 'text/javascript',
  },
],

当然这是针对android的，可以调整ios的公共路径。那么你需要做的就是

nuxt generate

设置脚本将文件夹www/android_asset/www/front-end移至www/front-end

cordova add platform android@latest --save
cordova run android

这不需要使用任何额外的插件，只需将 cordova 添加到现有的 nuxt 存储库中即可。然而它并不完整，只是一个例子，仍然需要index.js，并等待cordova 文档中的设备准备就绪之类的事情。

https://github.com/amritk/min-repro-nuxt-cordova