If it is already installed, skip directly, otherwise execute the following command:
Step Two: Create a new Cordova projectNPM install-g Cordova
Execute 3 Commands separately
Cordova Create Cordovaapp Com.cordova.testapp
CD Cordovaapp
Cordova Platform Add Android
which
After executing these 3 commands, the Cordova project is established.
Step three: Modify the Vue projectVue items are not available in this article
1. First modify the index.html of the Vue projectJoin in between head
<meta http-equiv="Content-security-policy"Content="default-src ' self ' data:gap:https://ssl.gstatic.com ' unsafe-eval ', style-src ' self ' unsafe-inline '; media-src *; I Mg-src ' self ' data:content:;"><meta name="format-detection"Content="Telephone=no"><meta name="Msapplication-tap-highlight"Content="No"><meta name="Viewport"Content="User-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, Width=device-width">
Note that adding <meta http-equiv="Content-Security-Policy" content="default-src ‘self‘ data: gap: https://ssl.gstatic.com ‘unsafe-eval‘; style-src ‘self‘ ‘unsafe-inline‘; media-src *; img-src ‘self‘ data: content:;"> may cause the page style to change, if the change is not added, otherwise it is recommended to add. This section is primarily to prevent cross-site scripting attacks.
Add a cordova.js between body
<body> <div id="app"></div> <script type= "text/ JavaScript "src=" Cordova.js "></script> <!--built files would be auto injected--></body>
2. Modify the Index.js file in the Config folder
In the build, modify the
' Static ' , ' / ',
For
"' , ",
3.在main.js里面添加（省略这步骤，打包后可能会导致出现空白页）
from ' Vue-cordova ' vue.use (Vuecorvova)
Of course, Vue-cordova needs to be introduced in the Vue project and executed at the Vue Project terminal.
NPM Install Vue-cordova--save
测试：
and run it at the Vue Project terminal.
NPM Run Dev
To see if we can run it up, If the normal description here is not a problem (note that this is the time to run the Document.addeventlistener note, because in the browser environment is not able to find cordova.js can not hear the Deviceready event, packaged on the real machine to achieve monitoring).
Fourth step: Put the Vue file into the Cordova project and package it (after successful modification, just repeat the step)1. Run first in the Vue project
NPM Run Build
After execution, a dist folder will be generated to find this folder to copy all the files inside to your Cordova project's WWW folder to replace its original files.
2. Then execute at the Cordova project Terminal
Cordova Build Android
An executable apk file (Cordova project file \platforms\android\app\build\outputs\apk\debug\app-debug.apk) will be generated and copied to the Android phone installation.
Cordova Package Vue Project (Android)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
