如何在 MS Visual Studio Community 2017 中使用 Ionic 3?
Posted
技术标签:
【中文标题】如何在 MS Visual Studio Community 2017 中使用 Ionic 3?【英文标题】:How to use Ionic 3 with MS Visual Studio Community 2017? 【发布时间】:2017-07-26 15:55:23 【问题描述】:我在 MS Visual Studio Community 2017 中使用 Ionic 2 已经有一段时间了。 在 Visual Studio Market 中可以下载和使用插件 Ionic 2 Templates for VS。
就像点击一样简单:
新项目 > TypeScript > 移动应用 > Ionic 2 - 空白
但是我找不到 Ionic 3 的模板。(似乎还没有发布)
知道如何手动将 Ionic 3 添加到 Visual Studio 中吗?
谢谢!
【问题讨论】:
【参考方案1】:我刚刚开始,所以这可能不太正确,但我做了以下事情:
确保您已通过 VS2017 安装程序安装了 Cordova 工作负载。 使用 VS2017 和 Ionic 2 模板创建一个新项目 如果您还没有安装 Ionic,请通过命令行:npm install -g ionic@latest
通过命令行创建一个新的 Ionic 3 应用程序。根据您要使用的模板,使用sidemenu
或tabs
或blank
。我看到https://market.ionic.io/starters/ 中还有很多内容,您可能可以以某种方式使用它们。
ionic start YourNewAppName sidemenu
将 Ionic 2 项目文件夹中的文件复制到 Ionic 3 项目文件夹中:
taco.json
XXXX.jsproj
(暂时不要重命名)
XXXX.sln
(暂时不要重命名)
在VS2017中启动XXXX.sln
VS提示我升级工程文件,OK。
VS 提示我设置 typescript 的版本,OK。
现在 .sln 文件可用于编辑和运行 Ionic 3 项目
【讨论】:
我尝试使用 npm 但无法识别,所以我安装了 Node JS。现在使用 ionic 时会出现同样的错误。谷歌建议安装科尔多瓦。我怎么能在没有安装在 visyal studio 2017 中的情况下使用 ionic? 是的,您需要通过 VS2017 安装 Cordova 才能使其在 VS 中运行。 我试过这个并且 sln 工作(或多或少)。但是在为 android 构建时,ionic:build 没有启动,并且在构建 apk 之后(我能够通过 NPM Task Runner 启动 ionic:build)我收到一个错误,即没有找到要发布到设备的 apk。但是该 apk 已创建,可以在 output\apk\debug 文件夹中找到。有什么帮助/建议吗?【参考方案2】:此答案的未来读者需要了解,下面引用的版本是发布时软件包的最新版本。这意味着,在阅读时可能会有更新的版本。
-
升级您的 Ionic CLI。在本文发布时,最新版本是 3.9.1。
npm install -g 离子
-
升级您的 NPM Ionic 包依赖项。
您很可能需要 Angular 的 4.x 版本,以及相关的 Angular npm 依赖项(即 CORE、编译器、FORMS、HTTP 等)。您很可能需要 3.x 版本的 Ionic-Angular 和 4.x 版本的 Ionic 本机软件包。
在我看来,最好的方法是使用最新版本的 Ionic CLI 创建一个全新的临时 Ionic 应用程序。然后检查 package.json 文件中列出的 NPM 包,并手动更新您的真实应用程序的 package.json 以匹配。保持谨慎和有条不紊。
为了您的方便,我附加了一个使用全新 Ionic 3 应用程序创建的默认 package.json 依赖项。
"dependencies":
"@angular/common": "4.3.5",
"@angular/compiler": "4.3.5",
"@angular/compiler-cli": "4.3.5",
"@angular/core": "4.3.5",
"@angular/forms": "4.3.5",
"@angular/http": "4.3.5",
"@angular/platform-browser": "4.3.5",
"@angular/platform-browser-dynamic": "4.3.5",
"@ionic-native/core": "4.1.0",
"@ionic-native/splash-screen": "4.1.0",
"@ionic-native/status-bar": "4.1.0",
"@ionic/storage": "2.0.1",
"ionic-angular": "3.6.0",
"ionicons": "3.0.0",
"rxjs": "5.4.3",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.16"
,
"devDependencies":
"@ionic/app-scripts": "2.1.4",
"typescript": "2.3.4"
,
【讨论】:
以上是关于如何在 MS Visual Studio Community 2017 中使用 Ionic 3?的主要内容,如果未能解决你的问题,请参考以下文章
MS Visual Studio 2010 如何使用 .asm 生成的文件
如何在 MFC 中支持多种文档类型,例如 MS Office 应用程序或 Visual Studio
如何在 MS Visual Studio 调试器中查看 DOMString(来自 apache xerces 库)?
如何在调试模式下在 MS Visual Studio 中显示零件表达式的值?