如何使用Visual Studio 2013社區創建離子應用程序？

有沒有關於如何構建ionic apps on visual studio的教程？如何使用Visual Studio 2013社區創建離子應用程序？

有沒有人用過ionic templates in VS？當我嘗試打開該模板，我得到這個錯誤：

Ionic template not installing

This extension is not installable on any of the currently installed products.

如果我下載和安裝通過模板（新項目的對話）我得到這個錯誤產生的後項目：

Issue after opening Ionic project

The imported (CordovaTools) project was not found

問題：我怎樣才能得到那些.targets文件這裏找不到VS？

來源

2015-06-18 xameeramir

這是因爲此模板現在只支持Visual Studio 2015 RC，但您使用的VS 12.0是VS2013。

[更新]

注：以下內容可以移動到博客或地方可以在未來共享給他人。

環境：

工具：Visual Studio的2013更新爲Apache科爾多瓦CTP 3.1

OS 4個+工具：Windows 8.1中的親

主題：如何制定從離子出發https://github.com/driftyco/ionic-starter-tabs在Visual Studio 2013中的模板

步驟1：

在Visual Studio 2013中創建了一個新的空白Cordova App。

File-> New-> Project-> JavaScript-> Apache Cordova Apps - > Blank App（名爲TestIonicTemplate）。

第2步：

從https://github.com/driftyco/ionic-starter-tabs 打開網站http://code.ionicframework.com/#下載的模板。我們稍後會使用它。

第3步：

假設模板文件夾是離子型起動器的選項卡主，而該項目是TestIonicTemplate。然後開始將事情合併到VS項目中。

轉到Visual Studio中，添加一個新的文件夾命名模板的根項目文件夾下。
執行以下操作複製過去：從將所有.js文件\離子起動器的選項卡主\ JS \到TestIonicTemplate \腳本移動從\離子起動器的選項卡主\模板所有 HTML文件到 TestIonicTemplate \模板
回到VS - >右鍵點擊上面提到的文件夾 - > add->現有的項目。添加這些文件後，我們有以下結構。

enter image description here

第4步：

執行以下操作修改VS項目的基礎上，我們下載的模板中的index.html中的index.html。

添加參考ionic.css和ionic.bundle.js我們可以選擇使用本地副本或離子CDN，你可以得到所有的這些從 http://code.ionicframework.com/#我前面提到的。我在這裏使用CDN。
刪除對index.js的引用並添加對所有.js的引用我們複製。
複製從\離子起動器的選項卡主\ index.html中的元線
附加「NG-應用=‘啓動器’」在本體和刪除缺省HTML 元件體。
複製從\離子起動器的選項卡主\ index.html的主體內容現在我們有以下的index.html代碼：

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8" /> 
 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
 
    <title>TestIonicTemplate</title> 
 

 
    <!-- TestIonicTemplate references --> 
 
    <link href="http://code.ionicframework.com/1.0.0/css/ionic.css" rel="stylesheet"> 
 
    <link href="css/index.css" rel="stylesheet" /> 
 
    <!-- ionic/angularjs js --> 
 
    <script src="http://code.ionicframework.com/1.0.0/js/ionic.bundle.js"></script> 
 
</head> 
 
<body ng-app="starter"> 
 
    <!-- 
 
     The nav bar that will be updated as we navigate between views. 
 
    --> 
 
    <ion-nav-bar class="bar-stable"> 
 
     <ion-nav-back-button> 
 
     </ion-nav-back-button> 
 
    </ion-nav-bar> 
 
    <!-- 
 
     The views will be rendered in the <ion-nav-view> directive below 
 
     Templates are in the /templates folder (but you could also 
 
     have templates inline in this html file if you'd like). 
 
    --> 
 
    <ion-nav-view></ion-nav-view> 
 

 
    <!-- Cordova reference, this is added to your app when it's built. --> 
 
    <script src="cordova.js"></script> 
 
    <script src="scripts/platformOverrides.js"></script> 
 

 
    <script src="scripts/app.js"></script> 
 
    <script src="scripts/controllers.js"></script> 
 
    <script src="scripts/services.js"></script> 
 
</body> 
 
</html>

這裏是結果我在紋波看到：

enter image description here

來源

2015-06-24 04:04:36

我正在使用VS 2013社區。難道它不支持[科爾多瓦]（http：//blogs.msdn。COM/B/somasegar /存檔/ 2014/05/12 /移動第一雲先發展-視覺工作室Apache的科爾多瓦-工裝和 - 雲優化的淨futures.aspx）？ – xameeramir

VS 2013確實支持科爾多瓦。但你提到的模板不支持VS 2013.讓我給你一些關於如何在以後創建離子cordova應用程序的步驟。我現在沒有開發環境。 –

檢查我的更新。 –

我不太理解你的問題，但你可以使用Visual Studio Code（VSC）開發Ionic應用程序和其他web相關項目，它已經帶有角度插件。

如果你的意思是說，如果VS可以創建離子項目，我不認爲這是可能的。通過CMD /終端

NPM創建它安裝-g科爾多瓦離子
離子開始對myApp標籤
CD對myApp
離子平臺加入IOS（或機器人）
離子構建IOS（或機器人）
離子模仿IOS（或機器人）

，然後通過喲打開它你最喜歡的IDE或文本編輯器開始開發。

來源

2015-06-22 12:54:37

是的，我明白@JosephOcasio。這是我通過[guide]（http://ionicframework.com/docs/guide/starting.html）完成的。我很想看到這個模板的工作。 – xameeramir

如何使用Visual Studio 2013社區創建離子應用程序？

回答

相關問題