在Visual Studio中导入IBM MobileFirst Platform Cordova应用

在移动开发领域，不同的技术栈和工具库有着各自推荐的集成开发环境（IDE）。例如，Java开发者可能会选择Eclipse，使用Microsoft技术栈的开发者可能会选择Visual Studio，iOS和Mac应用开发者可能会选择XCode，而Web开发者可能会选择Sublime Text、Brackets或TextMate（仅限Mac）。使用新的IDE进行编码总是一个挑战，因为需要学习新的IDE，并且可能已经熟悉了另一个IDE及其快捷键。将在喜爱的IDE上编码时更加高效。

创建MFP Cordova应用

在一篇关于将Visual StudioCordova项目导入IBM MobileFirst的文章之后，有人提出了一个有趣的用例，即反向操作。因此，在这篇博客文章中，将学习如何将IBM MobileFirst Platform Cordova应用导入到Visual Studio 2015中。

使用IBM MobileFirst平台v7.1，可以使用MobileFirst命令行接口（CLI）创建一个带有IBM MobileFirst特性的ApacheCordova应用，这些特性被打包为一个名为cordova-plugin-mfp的插件。由于Cordova应用的创建超出了这篇博客文章的范围，这里提供了一个，其中包含了详细的介绍，包括CLI命令。

使用上述链接中“逐步构建示例”部分提到的CLI命令，创建一个名为MFPCordovaApp的新Cordova项目。按照其他指示添加平台和插件（振动和相机）。创建成功后，Cordova文件夹结构应该如下图所示：

以下是在Mac终端上捕获的CLI命令，供参考：

现在，当使用CLI命令mfp cordova preview在移动浏览器模拟器（MBS）上运行MFPCordovaApp时，iOS和Android上的应用程序在点击相机按钮后将调用Cordova相机插件，输出应该如下图所示：

创建Visual Studio Cordova项目

按照这个中提到的前三个步骤进行操作。注意：不要添加任何外部库或框架，如Ionic或AngularJS，因为这超出了这篇博客文章的范围。

创建成功后，导航到Visual StudioCordova项目文件夹，应该看到如下图所示的文件夹结构：

MFPCordovaApp文件夹结构

截至目前，没有定义的方法来实现这一点。因此，下面提到的步骤只是一个权宜之计，以便在Visual Studio中打开MFP项目以进行进一步开发。如果注意到，MFP cordova项目和VS cordova项目都被赋予了相同的名字（MFPCordovaApp）。这背后有一个充分的理由。Visual Studio理解解决方案（.SLN）文件和项目（.CSproj/.JSproj）文件。即使解决方案文件的名称有轻微的变化，也可能导致在Visual Studio中加载项目时出现问题。一旦按照下面提到的步骤操作，就会更加理解这一点。

打开MFPCordova项目文件夹，创建一个名为“MFPCordovaApp”的新文件夹。将MFPCordova项目文件夹中的所有其他内容移动到新创建的MFPCordovaApp文件夹中。（现在当打开MFPCordova项目文件夹时，应该只看到一个文件夹，即MFPCordovaApp）。

现在，将VSCordova项目文件夹中的MFPCordovaApp.sln文件移动到MFPCordova项目文件夹中。MFPCordova项目文件夹应该如下图所示：

将VSCordova项目的MFPCordovaApp.jsproj、taco.json文件和合并文件夹移动到MFPCordova项目的MFPCordovaApp文件夹中。

在Visual Studio2015中打开MFPCordova项目的MFPCordovaApp.sln，并点击下图中突出显示的“显示所有文件”按钮。

选择灰色的文件夹，即bin、bld和platforms，并通过右键单击单个文件夹并选择菜单中的“包含在项目中”来将它们包含到项目中。

现在，当在Visual Studio 2015中运行迁移的cordova项目时，Android Ripple-Nexus模拟器上的输出应该如下图所示：

可以通过在Visual Studio 2015中打开config.xml文件来导入自定义插件，并添加更多Cordova支持的平台。