Apache Cordova development environment construction (1) - Visual Studio

Original: Apache Cordova Development Environment Construction (1) - Visual Studio

1. Use Visual Studio to develop Apache Cordova mobile app

1. Version requirements, Visual Studio requires 2015 or 2017

2. After installation, check Apache Cordova of the JavaScript application and the tools it depends on.

The installer for Visual Studio 2015 includes third-party open source software that supports Cordova app development:

Joyent Node.js enables Visual Studio to integrate with Apache Cordova Command Line Interface (CLI) and Apache Ripple Emulator
Git CLI required to manually add Git URIs for specific Cordova plugins.
Run the Apache Ripple emulator on iOS and Android with Google Chrome
Apache Ant 1.8.0 or higher is required for the Android build process.
The Android build process requires 32-bit Oracle Java JDK 7. Note: 64-bit Java is not supported. Java8 is recommended
The Android build process and the Android SDK that Ripple needs to use.
Apple iTunes deploys applications to iOS devices.

2. After Visual Studio 2015 or later is successfully installed, you need to configure environment variables

In many cases, for the speed of VS installation, JDK, Android SDK, etc. will not be selected when installing VS. You can use what was previously installed.

In this case, environment variable configuration must be performed.

1. In order to better reduce errors, it is recommended to directly modify the environment variables of the system

jdk environment variable configuration

Apache Ant Introduction and Configuration

AndroidSdk download address and environment variable configuration

2. Of course, it can be modified separately in the configuration of VS. Visual Studio can be used to detect and maintain the installation path in the following environment variables:

ADT_HOME points to the Android installation path.
ANT_HOME points to the Ant folder on your computer.
GIT_HOME points to the Git installation path.
JAVA_HOME points to the Java installation path.

Visual Studio uses these environment variables when creating and running your app. You can view environment variables and modify their values through the Visual Studio Options dialog .

On the Visual Studio menu bar , choose Tools , Options .
In the Options dialog, select Tools for Apache Cordova, then select Environment Variable Overrides.
Please select the checkbox of the item you want to modify, and then modify the value.

Third, use VS to create a Corodva project

1. Create a project

2. The creation result is as follows, the config.xml configurator can configure the information of each platform, and install and manage the Cordova plug-in.

3. Directory structure description

merges stores the special code of each platform, which is merged and compiled with the www directory, and the code files under the same file merges take precedence.

plugins is the plugin directory, and cordova's native API for accessing local device properties is also provided in the form of plugins.
res applies special resources (icons and splash screens) for each platform.
www contains application code.
- css Contains basic CSS styles for the default blank template.
- images Suggested app images are saved here.
- scripts is the default save directory for JavaScript and TypeScript files.

config.xml contains the configuration file of the project
taco.json stores project metadata that enables Visual Studio to build non-windows OS like mac
www\index.html is the default home page of the application.
Project_Readme.html contains useful informational links.

4. If the installation package under the corresponding platform is successfully generated, it can be used directly.

Fourth, the problems often encountered when starting to use the Cordova project are sorted as follows:

Apache Cordova development environment construction (2) VS Code

Cordova event finishing

cordova-plugin-vibration device vibration finishing

Apache Cordova development environment construction (1) - Visual Studio

Guess you like