quasar-framework学习笔记
官方网站: http://quasar-framework.org/
创新互联公司专业为企业提供兴化网站建设、兴化做网站、兴化网站设计、兴化网站制作等企业网站建设、网页设计与制作、兴化企业网站模板建站服务,十多年兴化做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。
一、安装
1、 安装quasar-cli
npm install -g quasar-cli
2、 使用quasar starter kits初始化项目
quasar提供了多套开发套件,可以使用quasar list查看当前可用的套件
其中官方提供5套开发套件,使用方法如下
quasar init
例如想安装默认套件,安装到当前目录的demo文件夹下
quasar init default demo , 然后进入demo目录npm install即可
二、开始使用
1、quasar支持通过开发模式启动,支持热重载
可以通过 quasar dev [theme] 来启动项目
例如:
quasar dev 或者 quasar dev mat 使用mat主题启动
quasar dev ios 使用ios主题启动
使用default套件安装启动后:
使用pwa套件安装启动后:
剩余的0.13版本,webpack1和vue1在此就不做赘述了
另外发现非官方提供的这个meteor安装后 quasar dev会报错:
2、模板
一些通用页面框架,可以在根目录下的templates文件夹下提前写好,需要创建新页面时,直接通过 quasar new [templates文件夹下的模板文件] [文件名称]
使用default套件搭建好项目后,templates下默认会给出三个模板,layout,page,component,也可以自己在里写好。以layout举例:
quasar new layout temp
这是src/components下就会多出一个根据layout模板创建好的temp.vue文件,文件的内容与layout页面一模一样
3、演示app
通过quasar dev --play启动时可以同时生成一个二维码
手机扫描后可直接查看页面
酷炫!
文章标题:quasar-framework学习笔记
文章位置:http://ybzwz.com/article/pjighi.html