初识Framework7,搭建app手机端项目

写在前面:在Framework7 (以下简称F7)的官方文档中提到“因为Framework7是通过Ajax在不同页面间跳转的,所以你需要启动一个 http 服务器才可以(不要直接打开本地文件)”,使用工具HBuilder,创建移动App项目,可以解决这个问题,实现页面间的跳转。

这里写图片描述

点击“下载”,等待下载完成解压后,不需要安装,直接运行.exe文件即可。

这里写图片描述

运行后会跳转到以下页面,选“暂不登录”,进入入门教程页面。

这里写图片描述

之后,在菜单导航栏中,选择“文件”-> “新建” ->”移动App”,输入项目名称“app”(自定义,其它也行)。

这里写图片描述

将F7目录下的dist文件夹复制到app目录下,并修改名称为“framework7”,此时,项目的目录结构应该是

这里写图片描述

在index.html点击鼠标右键,选择运行方式->web应用程序,将页面输出到浏览器上(此处运用的是谷歌浏览器)。
在浏览器上选择开发者工具(快捷键F12)->切换响应式页面->选手机型号。

这里写图片描述

此时就已经搭建好啦,后续自己进行学习了。

猜你喜欢

转载自blog.csdn.net/lxhuang_14/article/details/78774827