search

phonegap / phonegap-template-react-hot-loader

PhoneGap Template using React, ES2015, Webpack, and hot module reloading
MIT License
79 stars 21 forks source link

When adding Media plugin, cannot resolve cordova/argscheck etc #15

Open uglycoyote opened 6 years ago

uglycoyote commented 6 years ago

I was struggling to get the Media plugin working with a phonegap app which I started using the blank template and then later added Webpack to, and I posted this stack overflow question.

https://stackoverflow.com/questions/50633212/in-cordova-phonegap-webpack-application-uncaught-referenceerror-argscheck-is-n

I thought perhaps if I used this react-hot-loader template which has webpack pre-intergrated I might be able to get the Media plugin easier and then figure out what I did wrong with my own Webpack setup. Instead I found that I'm running in to pretty much the same problem.

Here's what I did:

phonegap plugin add cordova-plugin-media

in hello.js,

import * as Media from 'cordova-plugin-media/www/Media';

and then tried to add a function which would load and play a sound when you press the hello button

  test() {
      var sound = new Media('cdvfile://localhost/www/woopwoop.mp3', ()=>{sound.play()});
  },

  sayHello(msg) {

    this.test();

   ...

and here's what I get

from Webpack output (running npm start)


ERROR in ./~/cordova-plugin-media/www/Media.js
Module not found: Error: Cannot resolve module 'cordova/argscheck' in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova-plugin-media/www
 @ ./~/cordova-plugin-media/www/Media.js 22:16-44

ERROR in ./~/cordova-plugin-media/www/Media.js
Module not found: Error: Cannot resolve module 'cordova/utils' in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova-plugin-media/www
 @ ./~/cordova-plugin-media/www/Media.js 23:12-36

ERROR in ./~/cordova-plugin-media/www/Media.js
Module not found: Error: Cannot resolve module 'cordova/exec' in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova-plugin-media/www
 @ ./~/cordova-plugin-media/www/Media.js 24:11-34

ERROR in ./~/cordova-plugin-media/www/Media.js
Module not found: Error: Cannot resolve module 'cordova/channel' in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova-plugin-media/www
 @ ./~/cordova-plugin-media/www/Media.js 248:18-44
w

and in Chrome:

Module not found: Error: Cannot resolve module 'cordova/argscheck' in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova-plugin-media/www
resolve module cordova/argscheck in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova-plugin-media/www
  looking for modules in /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules
    /Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova doesn't exist (module as directory)
  looking for modules in /Users/mike/node_modules
    /Users/mike/node_modules/cordova doesn't exist (module as directory)
[/Users/mike/development/phonegap/ReactHotLoaderTemplate/node_modules/cordova]
[/Users/mike/node_modules/cordova]
 @ ./~/cordova-plugin-media/www/Media.js 22:16-44

I'm aware that these argscheck, etc., modules are defined within cordova.js but I'm not clear on what needs to change in order to make webpack aware of these dependencies.