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 ...
随机推荐
- Linux 第八天
4.源码包和rpm包的区别 1)区别 安装前:概念上的区别 安装后:安装位置不同 2)安装位置 rpm包安装位置 Rpm包默认安装路径 /etc/ 配置文件安装目录 /usr/bin/ 可执行的命令安 ...
- 虚拟机 django 端口无法连接
我的虚拟机django服务器为192.168.27.100,使用启动命令python manage.py runserver 9001启动后,发现笔记本电脑的游览器无法连接 python@qinhan ...
- re、词云
正则: re.S使点也能匹配到\n:re.I不区分规则中的大小写:re.X忽略空格及#后的注释:re.M把^和$由文首文末变为各行的首尾. Egの删除各行行尾的alex,alex不区分大小写: ...
- Zabbix--1
ZABBIX 与其他监控程序比较.
- 小游戏——金庸奇侠传(JAVA,对面向对象的进一步了解)
金庸群侠传 游戏运行界面: 游戏实现源码: package game.logic; //人类 public class Person { public String name; //名字 Pers ...
- 【微服务】.netCore eShopOnContainers 部署实践《二》
Docker 专业术语介绍 优点:轻量级.可伸缩(灵活性).可靠性.可移植 Container image A package with all of the dependencies and in ...
- 目标检测的图像特征提取之HOG特征
HOG特征: 方向梯度直方图(Histogram of Oriented Gradient, HOG)特征是一种在计算机视觉和图像处理中用来进行物体检测的特征描述子.它通过计算和统计图像局部区域的梯度 ...
- Tools - Windows OS
001 - 文本操作 Ctrl + C / Ctrl + V / Ctrl + X / Ctrl + Z / Ctrl + A:复制/粘贴/剪贴/撤销/全选. 002 - 窗口分屏 使用快捷键 选中程 ...
- Apple Watch笔记-应用内导航模式
最近苹果婊上市,水果也发布了Xcode 6.2正式版,WatchKit也可以正常使用了.水果很及时地提供了Apple Watch的开发文档,我也及时地尝试着边学习边开发Watch App. 今天主要想 ...
- mongodb4.0.2 复制集主从部署
介绍 复制集(Replica Sets),是一个基于主/从复制机制的复制功能,进行同一数据的异步同步,从而使多台机器拥有同一数据的都多个副本,由于有自动故障转移和恢复特性,当主库宕机时不需要用户干预的 ...