Cordova+vue(1) for Hybrid Application Development

1. Create an application with Cordova

cordova create oneApp

Error creating app with Cordova

You can't use cnpm when Cordova is installed. You should use npm. Although cnpm is fast, the mistakes made later will definitely save a lot more time than this.

Correct installation method

npm install -g cordova

or

npm install -g cordova --registry=https://registry.npm.taobao.org

npm install -g cordova 报错ENOENT: no such file or directory

The reason is that when the previous download and installation failed, the node_modul folder was generated, and it was ok to delete all of them and download and install again.

2. Create an application with vue

1. Create a new project based on the webpack template (created in the Cordova project directory above)

$ vue init webpack oneApp (the name can be the same as the above project)

$ cd oneApp

$ npm install

$ npm run dev

Project directory after creation

2. Modify the Vue project config/index.js file

'use strict'
module.exports = {
  build: {
    index: path.resolve(__dirname, '../../www/index.html'),
    assetsRoot: path.resolve(__dirname, '../../www'),
    assetsPublicPath: '',
 }
}

3. Packaging and compiling

1. Build the Vue project. After compiling, the packaged and generated code will automatically run to the WWW file in the main directory, cd to the MyApp directory of Vue, and execute npm run build

2. Compile cordova for various platforms, cd to the main directory, and execute cordova build iOS, cordova build Android, etc.

ps: I used to use Cordova+Ionic, and I just started using Cordova+vue, so I went through a lot of pitfalls. If you have any questions please comment below.