临时项目需要使用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.搭建开发环境的更多相关文章

  1. Ionic 2 + 手动搭建开发环境教程 【转】

    ionic简介 为什么选用ionic: 彻底开源且免费 性能优异 基于红的发紫的AngularJs 漂亮的UI 强大的命令行(基于更热门的nodejs) 开发团队非常活跃. ngCordova,将主流 ...

  2. Window上python 开发--1.搭建开发环境

    事实上在开发python最好在ubuntu环境下,简单也便于扩展各个package.可是我的linux的电脑临时不在身边.还的我老婆的电脑win7没办法啊. 因为python的跨平台性.在window ...

  3. 智龙开发板搭建llsp环境

    智龙开发板搭建llsp(linux+lighttpd+sqlite3+php)环境 1. 准备 1. 智龙开发板V3 2. 软件编译环境:VirtualBox6+CentOS6.10-i386.min ...

  4. 开发工具--搭建python环境

    工具|搭建python环境 实现python2版本与python3版本的环境搭建. 正文 1.Python下载 官网: www.python.org 下载: ( 64位3.5.2Windows x86 ...

  5. Android开发学习——搭建开发环境

    在学校开课学习了android的一些简单的UI组件,布局,四大组件学习了2个,数据存储及网络通信,都是一些简单的概念,入门而已.许多东西需要自己去学习. 学习一下 Android开发环境的搭建,两种方 ...

  6. SpringBoot+SpringCloud+vue+Element开发项目——搭建开发环境

    1.新建一个项目

  7. angularJS学习笔记之——搭建学习环境

    学习AngularJS已经好几天了,从今天开始学习AngularJS环境搭建. 无论是Mac.Linux或Windows环境中,您均可遵循本教程学习编程. 第一步:安装Git Git是什么呢? Git ...

  8. Cordova+Angularjs+Ionic 混合开发入门讲解

    作为一名学习Android开发的学生,对于移动开发的发展趋势颇为关注,大家都知道,现在原生的移动开发在企业上基本很少使用了,大部分企业为了降低成本,选择了webapp,hybrid(混合开发)这两种模 ...

  9. 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo

    目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...

随机推荐

  1. C#延时函数

    用Thread方法: 先using system.threading; 再在需要延时的进程处插入 thread.sleep(int);

  2. Docker环境安装与配置

    Docker 简介 Docker使用Go语言编写的 安装Docker推荐LInux内核在3.10上 在2.6内核下运行较卡(CentOS 7.X以上内核是3.10) Docker 安装 安装yum-u ...

  3. 关于esp32的省电模式的WiFi连接

    对于ESP32,其作为一款集成了2.4GHz WiFi和蓝牙双模块的单芯片,所有基于wifi和蓝牙开发是学习esp32的重要一环,今天WiFi原理和网络结构 可以点击链接进行详细的了解,这里就不做详细 ...

  4. C++ lamba使用

    Moderm Effective C++ 条款31 第206提到了按引用捕获局部变量和函数形参时,如果lambda式的生命期依赖于局部变量和函数形参的生命期,需注意空悬引用的问题. 原书的例子不够直观 ...

  5. C# Autofac集成之Framework WebAPI

    Web API 2集成需要Autofac.WebApi2 NuGet包. Web API集成需要Autofac.WebApi NuGet包. Web API集成为控制器,模型绑定器和操作过滤器提供了依 ...

  6. UIAlertControllerStyleActionSheet 崩溃。

    即使Devices 设置为iPhone模式,在审核时还是运行在iPad的小屏模式下.因此必须 UIActivityViewController UIAlertControllerStyleAction ...

  7. hotmail 收不到邮件的问题

    之前用 hotmail 注册过一个 aws 账号,起了一个 ec2 的免费一年的 VPS,然后没怎么用,不久就把这事忘了. 直到有一天手机收到信用卡扣款消息,我就马上去登账号,却怎么也想不起密码来了, ...

  8. 一篇入门 -- Git

    一. Git 介绍 Git作为一款分布式的==版本控制==工具,作为一名程序员,是必须要掌握的. 最初由林纳斯·托瓦兹(Linus Torvalds)创作,于2005年以GPL发布.最初目的是为更好地 ...

  9. Maven 的安装与配置

    最近公司需要新起一个项目,想使用maven+springmvc+spring+mybatis+mysql实现,以前我们的项目都是传统的老项目,没用过maven,Eclipse版本是GALILEO的,有 ...

  10. Java学习笔记53(网络编程:TCP协议案例)

    简易的案例 客户端: package demo; import java.io.IOException; import java.io.InputStream; import java.io.Outp ...