AngularJS+Ionic开发-1.搭建开发环境
临时项目需要使用AngularJS+Ionic+Cordova技术,半年前跟别人用过一段时间做过几个页面,目前别人已经无法联系了,只能我自己上了。
上次做完项目后,想抽时间好好巩固一下这方面的知识面来,后来其他项目忙起来就给扔下,主要原因还是懒啊,其实有好多的技术排着队等着好好研究呢,就是懒啊。
开发第一步,需要先把开发环境搭建起来。
1.开发IDE
选择VS Code,官方下载地址:https://code.visualstudio.com/ 。下载完成后,根据安装步骤一步步完成即可。
2.安装NodeJS
官网下载最新稳定版本,下载地址:https://nodejs.org/en/ 。下载完成后,根据安装步骤一步步完成即可。
安装完成后,打开系统cmd,输入node –v,若能够获取到对应的版本号,则完成安装。
3.安装Ionic
在VS Code中,打开终端控制器(快捷键:Ctrl+~),输入命令:npm install –g ionic。提示安装完成后,输入命令:ionic –version 可查看对应的版本。
4.安装Cordova
VS Code的终端控制器中,输入命令:npm install –g cordova。提示安装完成后,输入
命令:cordova –version 可查询对应的版本。
5.创建项目
通过打开文件夹操作,设定工程目录,VS Code的终端控制器中,输入命令:ionic start 。提示你输入工程名称,键入工程名称后,会让你选择项目模板,分别有tabs、blank、sidemenu、super、conference、tutorial、aws。通过键盘上下键选择需要的模板,按下Enter即可,创建过程中会提示“Would you like to integrate your new app with Cordova to target native iOS and Android?”(意思是是否将Cordova程序整合到原生的IOS或Android中),一般情况选择“N”即可。接下来就需要等待项目创建完成即可。
6.浏览器运行项目
项目创建完成后,在VS Code的终端控制器中,通过cd命令进入到项目目录,然后执行ionic serve,接下来执行项目编译过程,并自动打开浏览器,进入到http://localhost:8100/的页面。创建的Tabs项目的实际运行效果图如下:
AngularJS+Ionic开发-1.搭建开发环境的更多相关文章
- Ionic 2 + 手动搭建开发环境教程 【转】
ionic简介 为什么选用ionic: 彻底开源且免费 性能优异 基于红的发紫的AngularJs 漂亮的UI 强大的命令行(基于更热门的nodejs) 开发团队非常活跃. ngCordova,将主流 ...
- Window上python 开发--1.搭建开发环境
事实上在开发python最好在ubuntu环境下,简单也便于扩展各个package.可是我的linux的电脑临时不在身边.还的我老婆的电脑win7没办法啊. 因为python的跨平台性.在window ...
- 智龙开发板搭建llsp环境
智龙开发板搭建llsp(linux+lighttpd+sqlite3+php)环境 1. 准备 1. 智龙开发板V3 2. 软件编译环境:VirtualBox6+CentOS6.10-i386.min ...
- 开发工具--搭建python环境
工具|搭建python环境 实现python2版本与python3版本的环境搭建. 正文 1.Python下载 官网: www.python.org 下载: ( 64位3.5.2Windows x86 ...
- Android开发学习——搭建开发环境
在学校开课学习了android的一些简单的UI组件,布局,四大组件学习了2个,数据存储及网络通信,都是一些简单的概念,入门而已.许多东西需要自己去学习. 学习一下 Android开发环境的搭建,两种方 ...
- SpringBoot+SpringCloud+vue+Element开发项目——搭建开发环境
1.新建一个项目
- angularJS学习笔记之——搭建学习环境
学习AngularJS已经好几天了,从今天开始学习AngularJS环境搭建. 无论是Mac.Linux或Windows环境中,您均可遵循本教程学习编程. 第一步:安装Git Git是什么呢? Git ...
- Cordova+Angularjs+Ionic 混合开发入门讲解
作为一名学习Android开发的学生,对于移动开发的发展趋势颇为关注,大家都知道,现在原生的移动开发在企业上基本很少使用了,大部分企业为了降低成本,选择了webapp,hybrid(混合开发)这两种模 ...
- 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo
目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...
随机推荐
- 利用 Python 练习数据挖掘
本文由 伯乐在线 - 顾星竹 翻译,Namco 校稿.未经许可,禁止转载!英文出处:Giuseppe Vettigli.欢迎加入翻译组. 覆盖使用Python进行数据挖掘查找和描述数据结构模式的实践工 ...
- css概括
CSS:美化页面 层叠样式表 修改标签样式 1.分类:内联 内嵌 外部引用 (1)内联: 写在标签里面,以属性的形式表现 属性名为style (2)内嵌:写在head标签里面,以标签 ...
- 关于SGA中的granule size
1.什么是granule? granule直译为颗粒,ORACLE为SGA 中的组件(eg:log buffer/db buffer/large pool等)分配的最小单元为一个granule. 所以 ...
- 3.装配Bean 基于XML
一.实例化方式 3种bean实例化方式:默认构造.静态工厂.实例工厂 1.默认构造 <bean id="" class=""> 必须提供默认构造 2 ...
- WCF学习笔记一之通过配置web.config可以通过http访问接口
一.准备 这里涉及到三个文件,现在只是简单的把代码贴出来,后面再详细的讲一下. 三个文件分别是(都是wcf服务应用程序项目下的): 1.IService1.cs 2.Service1.svc 3.We ...
- Flask实例化的参数 及 对app的配置
首先展示一下: from flask import Flask app = Flask(__name__) # type:Flask app.config["DEBUG"] = T ...
- HTML和CSS使用注意事项
HTML 1.button标签 在IE中,button标签默认的type是button,而在其他浏览器和W3C标准中button默认的属性都是submit. 所以,在一个form表单中,如果butto ...
- [CocoaPods]如何使用CocoaPods插件
CocoaPods +插件 CocoaPods是一个由极少数维护者运营的社区项目,需要维护大量的表面区域.可以肯定地说CocoaPods永远不会支持Xcode支持的每个功能,即使这样,团队也必须对许多 ...
- 一个简单的C语言题背后的故事
最近看到了一个C语言问题,是要计算出这个函数的输出: #include <stdio.h> int Test(int x,int y, int z){ printf("x,y,z ...
- I2C软件调试思路并知识总结
I2C是一种只使用两根线的串行通信协议.一根线是串行数据线SDA,另外一种是串行时钟线SCL. I²C允许相当大的工作电压范围,但典型的电压准位为+3.3V或+5v. I²C的参考设计使用一个7比特长 ...