If you work on a Apache Cordova project in Visual Studio 2013 using Visual Studio Tools for Apache Cordova CTP 3 or 3.1 you should know there are important breaking changes in migrating the project from Visual Studio 2013 to Visual Studio 2015. The project can be migrated, but you have to do everything manually, as Visual Studio is not able to apply the changes automatically.
First of all, Visual Studio Tools for Apache Cordova CTP3.x are not longer supported in Visual Studio 2013 in the first place. If you try to install Update 5 it will prompt you to remove it before continuing.
This is explained in the release notes for Update 5.
Also note: All prior releases of the Tools for Apache Cordova are incompatible with Update 5. If you have previously installed a Tools for Apache Cordova CTP extension, you must uninstall that extension before installing Visual Studio 2013 Update 5. If you require Apache Cordova support, we encourage you to try Visual Studio 2015.
The options for those developing with the VS tools for Apache Cordova in VS2013 are either to switch to Visual Studio 2015 or not install the last update and continue to work with CTP 3.x in VS2013.
In this article I will show you how to migrate a Cordova application from VS2013 to VS2015 and I will exemplify with a test application.
I have this app called TestApp. It’s built with Ionic and AngularJS. It is a JavaScript app, not a TypeScript app, but this works just the same regardless what language you use. It has the following project structure, with the Javascript source code in a folder called app, the libraries in libs and the templates in views. There are other folders apart from the ones VS has created, mainly css and images.
 |
 |
The application is just a test, it doesn’t do anything but it works for both Android and iOS.
 |
 |
When you open this project in Visual Studio 2015 it is not loaded. Visual Studio complains that “This project is incompatible with the current edition of Visual Studio.”
You have to covert it manually in order to make it available for Visual Studio 2015. Fortunately, the steps to do this are documented, but not in MSDN as one might expect, but on GitHub. There is a document called Known Issues – Visual Studio 2015 that explains what has to be done.
- Create a new empty Apache Cordova app. The only purpose of this app is to copy from files to your actually project.
- Copy the .jsproj and taco.json files into the project folder of the application you migrate. Make sure you overwrite the existing .jsproj with this new project file.
- Delete the existing bin and bld folders
- Create a folder called www
- Move everything except for config.xml and folders merges, res and plugins to the www folder.
If you open the project again in Visual Studio 2015 it will work and you can build and run it. For my test application the new project looks like this.
You can see that the all the folders and files under the www folder appear automatically in the solution explorer. They are not added with a Content or Folder element in the .jsproj file. You can make a comparison of the old and new .jsproj and see how simplified the new file is.
Another thing to notice here is that the NodeJS module used for building the project is no longer called vs-mda (i.e. Visual Studio Multi-Device Application) but vs-tac (i.e. Visual Studio Tools for Apache Cordova).
However, when I tried to build I got the following error:
MSBUILD : cordova-build error BLD401: Error : BLD00401 : Could not find module ‘delayed-stream’] code: ‘MODULE_NOT_FOUND’. Please Go to Tools –> Options –> Tools for Apache Cordova –> Cordova Tools –> Clear Cordova Cache and try building again.
This might have been related to the version of Apache Cordova I had globally installed, i.e. 5.1.1. If you get the same install it via npm.
npm -g install delayed-stream
However, you may still get problems when you try to build for Android.
MSBUILD : cordova-build error BLD10205: Please install Android target “”
You may not have the required environment or OS to build this project
MDAVSCLI : error : cmd: Command failed with exit code 2
The Android target name is empty, but if you do a Rebuild you get more information and actual required target name:
[Error: Please install Android target: “android-21”.
Hint: Open the SDK manager by running: C:\Program\ Files\ (x86)\Android\android-sdk\tools\android.BAT
You will require:
1. “SDK Platform” for android-21
2. “Android SDK Platform-tools (latest)
3. “Android SDK Build-tools” (latest)]
C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v14.0\ApacheCordovaTools\vs-mda-targets\Microsoft.MDA.FileMirroring.targets(352,5): error MSB3073: The command “platforms\android\cordova\clean.bat” exited with code 2.
These can be installed using the Android SDK Manager. Make sure you select all the mentioned components.
With these changes you can build successfully for Android.
One more thing here is the version of Apache Cordova used by vs-tac to build. vs-tac uses Cordova 4.3.1, but I already had Cordova 5.1.1 installed on my machine and used by vs-mda. If you have a newer Cordova version than 4.3.1 what you have to do instruct vs-tac to use this one in the taco.json file.
{
"cordova-cli": "4.3.1"
}
Replace the version 4.3.1 of the cordova command line interface with desired version (in my case 5.1.1). When you rebuilt it will install it and build with it.
Your environment has been set up for using Node.js 0.12.7 (x64) and npm.
—— Ensuring correct global installation of package from source package directory: C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\Extensions\ApacheCordovaTools\packages\vs-tac
—— Name from source package.json: vs-tac
—— Version from source package.json: 1.0.0
—— Package already installed globally at correct version.
—— Installing Cordova tools cordova@5.1.1 for project from npm. This could take a few minutes…
You can find the various Cordova versions installed under %APPDATA%\npm\node_modules\vs-tac\node_modules\cordova.
For more information see:
Please note after following this my project was you may not have the required environment error, regardless of installing everything correctly.
The solution came when I changed Tools>>Options>>Build and Run (build output and build log) verbosity to Diagnostic. Which gave me more information as to why it was not building.
I discovered in my case a cordova-plugin-file transfer was causing it, so I uninstalled it and reinstalled it and viola it works!