美文网首页
ionic-angular2构建项目

ionic-angular2构建项目

作者: WenGuoLiang | 来源:发表于2018-05-18 15:11 被阅读0次

原文链接:

http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/ionic%E5%AD%A6%E4%B9%A0%E4%B9%8B%E5%BB%BA%E7%AB%8B%E4%B8%80%E4%B8%AAionic%E9%A1%B9%E7%9B%AE/

1.安装ionic:$npm install -g cordova ionic

2.更改命令所在位置到你容易找到的目录:cd directoryName

   例如:cd practice                                                  

3.终端输入命令新建一个工程:$ ionic start myApp blank(生成名字为myApp的空项目)

                                     或$ ionic start myApptabs(生成名字为myApp的带有选项卡的项目)       

 或$ ionic start myApp sidemenu(生成名字为myApp的带有侧边菜单的项目) 

 这里根据自己的项目需要,选择任意一个命令即可快速建立一个ionic framework项目。 

4.为这个项目配置iOS和android平台,在webstrom上的terminal终端中执行:

                  $ionic platform add iOS

                  $ionic platform add android

5.运行项目:如果想在电脑浏览器上看效果,可以执行:ionic serve

                 如果电脑已经安装了iOS或androidmo'ni模拟器可以执行以下命令看手机上的效果:

                 在iOS上建立并测试该项目:

 $ionic build iOS

 $ionic emulate iOS即可在电脑上模拟iOS手机运行这个app,

                 这两个命令也可以用ionic run iOS代替,效果一样。

                 在android上建立并测试该项目:

 $ionic build android

 $ionic emulate android

                  或者同样用一句ionic run android代替上面两行命令。

     执行以上命令后就可以在浏览器或模拟器上看到app的效果了~

6.ionic框架会自动生成以下文件:

可以看到下边包含了很多文件:

    ionic项目自动生成的文件:

    hooks:自定义的cordova的脚本命令来执行一些特别指令

 platfroms:包含添加的ios和android平台

 plugins:项目所用到的插件

 scss:scss代码,发布时会输出到你的www/css/

 www:最主要的文件,是我们所建立的应用,包括css,image,js,lib,templates,index.html

 bower.json:bower配置文件

    config.xml:Ionic的配置文件,可以配置app的id,名称、描述起始页等

    gulpfile.js:gulp构建工具的执行文件

    ionic.project:Ionic的项目文件

package.json :npm配置文件

 其余为webstrom中自己生成的文件:

    bowerrrc:bower配置文件

    gitignore:git配置文件

    editorconfig:统一代码的工具

相关文章

  • ionic-angular2构建项目

    原文链接: http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4...

  • Flink应用开发

    项目构建 项目模板 Flink应用项目可以使用Maven或SBT来构建项目,Flink针对这些构建工具提供了相应项...

  • maven常用命令介绍

    一、Maven的基本概念 主要服务于基于Java平台的项目构建,依赖管理和项目信息管理。1.1、项目构建 项目构建...

  • 二.Jenkins项目构建

    1. Jenkins项目构建类型 自由风格软件项目 Maven项目 流水线项目 1.1 自由风格软件项目构建 下面...

  • 从零开始构建Spring项目

    在Eclipse中构建Spring项目 目录 0 构建项目1 修改项目 pom.xml2 修改项目 web.xml...

  • Jenkins+kubernetes(第2节)

    Jenkins构建maven项目 jenkins中自动构建的项目类型有 自由风格软件项目(FreeStyle Pr...

  • 12-Maven

    依赖管理、项目构建和统一的项目结构。 1 依赖管理 2 项目构建 2.1 插件 插件与构建的生命周期绑定,mave...

  • 项目构建

    项目构建 多个开发者共同开发一个项目,每位开发者负责不同的模块,这就会造成一个完整的项目实际上是由许多的“代码版段...

  • 项目构建

    项目构建 gulp 合并、编译、压缩等 简单 使用 webpack 合并、编译、压缩等 强大 使用

  • 项目构建

    Android项目框架搭建(一) https://blog.csdn.net/zhangqunshuai/arti...

网友评论

      本文标题:ionic-angular2构建项目

      本文链接:https://www.haomeiwen.com/subject/pqpgdftx.html