vue+cordova 调用摄像头并对vue项目进行打包

参考文章：https://blog.csdn.net/u011042316/article/details/83828371

                 https://segmentfault.com/a/1190000014101362

 

一、建立vue项目和cordova项目步骤略过....

---------------------以下修改的都是vue项目--------------------------------

二、使用最简单的方法调用相机接口 (HelloCordova.vue)

这里面省略的很多配置，如getPicture里面的option参数都未配置，详细可见官网https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-camera/index.html

三、main.js文件里面主要就是这一段：添加deviceready事件监听，当cordova设备准备完成后再new vue

document.addEventListener('deviceready', function() {
  new Vue({
    el: '#app',
    router,
    render: h => h(App),
  })
 
}, false);

四、index.html里面修改为，主要是添加几行meta信息和cordova.js：

五、修改config/index.js文件：

我跟参考的文件不一样，我没有修改生成文件的路径，只修改了assetsSubDirectory和assetsPublicPath:，最后是通过拷贝的方式覆盖cordova项目的www文件的

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: '',
    assetsPublicPath: '',
    proxyTable: {
      '/api': {
        target: 'http://10.70.61.83:8093',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    },

-----------------------------------以上结束vuei项目修改-------------------------------

 执行vue项目的编译命令npm run build。 在根目录下生成dist文件夹，将所有文件复制到cordova的www文件夹下。

-----------------------------------以下修改cordova项目---------------------------------

 

一、使用cordova plugin add cordova-plugin-camera 添加相机插件，可用cordova plugin ls检查

二、使用cordova build android对项目进行打包

-----------------------------------结束对cordova项目操作----------------------------