Adding cordova to an existing vue app

Adding cordova to an existing vue app

It turns out that adding cordova to an existing vue app is pretty easy. If only I’d known this before trying at least 10 different ways:

First, make sure your environment is setup

npm install -g cordova
npm install -g @vue/cli

Clone your existing repo and cd to its folder

git clone my-cool-app
cd ~/git/my-cool-app

You can now install your project dependencies and start Adding cordova to an existing vue app

Pages: 1 2 3 4 5
Tags: , , , , , , , , , , , , , , , , , , , , , , , ,

This Post Has 8 Comments

  2. Phil Mickelson August 30, 2019

    I didn’t do quite 10 different ways but close! Thank you so much!

  3. Joao Cunha October 6, 2019

    Finally a tutorial that work, and no BS, only what really matters.
    Thank you!

  4. Joao Cunha October 7, 2019

    After adding Vuetify the project render just a white window on android.
    Please suggest.

  5. Philipp Ziegler March 27, 2020

    Hi,
    after I typed in “npm run cordova-serve-browser” there is an error. The
    error means that there is no “vue-cli-service” found. What should I do?
    I have installed all the packages which are mentioned.
    Thanks for your help.

  6. Philipp Ziegler March 30, 2020

    Hi,
    what does this error mean?

    Error: Cannot find module ‘vue-cli-plugin-cordova’
    Require stack:
    – C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicelibService.js
    – C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicebinvue-cli-service.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:982:15)
    at Function.Module._load (internal/modules/cjs/loader.js:864:27)
    at Module.require (internal/modules/cjs/loader.js:1044:19)
    at require (internal/modules/cjs/helpers.js:77:18)
    at idToPlugin (C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicelibService.js:145:14)
    at C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicelibService.js:184:20
    at Array.map ()
    at Service.resolvePlugins (C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicelibService.js:170:10)
    at new Service (C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicelibService.js:32:25)
    at Object. (C:UsersSilvieAppDataRoamingnpmnode_modules@vuecli-servicebinvue-cli-service.js:15:17) {
    code: ‘MODULE_NOT_FOUND’,
    requireStack: [
    ‘C:\Users\Silvie\AppData\Roaming\npm\node_modules\@vue\cli-service\lib\Service.js’,
    ‘C:\Users\Silvie\AppData\Roaming\npm\node_modules\@vue\cli-service\bin\vue-cli-service.js’
    ]
    }
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! com.demo.app@1.0.0 cordova-serve-browser: `cross-env CORDOVA_PLATFORM=browser vue-cli-service cordova-serve-browser`
    npm ERR! Exit status 1
    npm ERR!
    npm ERR! Failed at the com.demo.app@1.0.0 cordova-serve-browser script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

    npm ERR! A complete log of this run can be found in:
    npm ERR! C:UsersSilvieAppDataRoamingnpm-cache_logs2020-03-30T06_48_42_364Z-debug.log

    Thank you for your help.

  7. Francesco Brunelli April 14, 2020

    That was awesome thanks! Since my app is greater than 150mb i had to use file extensions, do you know how to access those files with vue/cordova?

Leave a Reply