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 ...
随机推荐
- Java程序员职业生涯规划完整版:从程序员到CTO( 摘)
在技巧方面无论我们怎么学习,总感觉需要晋升自已不知道自己处于什么水平了.但如果有清晰的指示图供参考还是非常不错的,这样我们清楚的知道我们大概处于那个阶段和水平. Java程序员 高等特性 反射.泛型. ...
- 1001. A+B Format 字符串
题目及答案链接 https://www.liuchuo.net/archives/1888 c++ 有关 字符串 和各种类型的转换 #include <string> string a; ...
- dubbo实现示例
创建MAVEN项目 项目结构: 在项目pom.xml中添加依赖 <dependency> <groupId>org.apache.zookeeper</groupId&g ...
- docker中gitlab-runner配置
1.启动gitlab-runner docker run -d --name gitlab-runner --restart always \ -v /opt/data/gitlab-runner/c ...
- 使用Phabricator进行代码审查
Pharicator 是FB的代码审查工具,主要开发者为Evan Priestley,是一个开源软件,可在Apache许可证第2版下作为自由软件分发.详细信息可查看官方文档.这里从应用的角度,一步一步 ...
- .net core mvc发布项目到IIS上出现500错误
如题,我把.net core mvc项目以应用程序方式挂到IIS默认网站下,结果出现了如下错误:HTTP Error 500.0 - ANCM In-Process Handler Load Fail ...
- React-Native 问题随记2: com.android.builder.testing.api.DeviceException
错误详细: Execution failed for task ':app:installDebug'.> com.android.builder.testing.api.DeviceExcep ...
- 《Nosql精粹》—— 读后总结
- CGI 和 FastCGI 协议的运行原理
目录 介绍 深入CGI协议 CGI的运行原理 CGI协议的缺陷 深入FastCGI协议 FastCGI协议运行原理 为什么是 FastCGI 而非 CGI 协议 CGI 与 FastCGI 架构 再看 ...
- 机器学习技法笔记:03 Kernel Support Vector Machine
Roadmap Kernel Trick Polynomial Kernel Gaussian Kernel Comparison of Kernels Summary