ionic学习--起步

来源:互联网 发布:asp.net商城系统源码 编辑:程序博客网 时间:2024/06/01 17:15

1.搭建临时环境

PS F:\web\3test\ionic2> cd F:\web\3test\ionic2\template

PS F:\web\3test\ionic2\template> F:\web\3test\ionic2\cmd\ionic.cmd serve -l

2.新建一个页面

PS F:\web\3test\ionic2\template> F:\web\3test\ionic2\cmd\ionic.cmd g page elm-index

找到app目录下app.module.ts,声明上面所创建的page是属于该模块的。在declarations对应的数组中写上上述page导出的类的名称,还得在entryComponents中数组中写

上述page导出的类的名称

在app.component.ts,再次声明模块,修改rootPage

3.模仿elm首页

出现问题 ion-tabs标签没有显示,原因未知?????

搭建全局环境

因npm不能下载改用淘宝镜像

npm install -g cnpm --registry=http://registry.npm.taobao.org

查看node 和npm符合版本

②cnpm install -g ionic

③cnpm install -g cordova

④创建一个带tab的项目ionic start myApp tabs

⑤ionic serve

[WARN] No local CLI detected.Starting with CLI 3.6,

the CLI must be installed locally to use localCLI
plugins.

[WARN] Not loading local CLI plugins in global mode. CLI functionality may be limited.

尝试解决安装CLI:cnpm install -g ionic@latest

再次 ionic serve

Error: Cannot find module '@ionic/app-scripts'

问题产生原因猜想:可能模板下载不全

可能是运行ionic start myApp tabs老在running command这步卡住,强制停止程序导致模板下载不完整

解决 ionic start myApp tabs --no-Git --skip-deps

进入项目目录

PS F:\web\3test\ionic2\myApp> cd F:\web\3test\ionic2\myApp\myApp

PS F:\web\3test\ionic2\myApp\myApp> cnpm install --save


ionic serve两次全选yes

终于跑起来了!!!!!