quasar-framework学习笔记


官方网站:,http://quasar-framework.org/


一、安装

,,,, 1,,安装quasar-cli

,,,,,,,,

,,2,使用类星体发射装置初始化项目

,,,,,,,,类星体提供了多套开发套件,可以使用类星体名单查看当前可用的套件

,,,,,,,,  quasar-framework学习笔记

,,,,,,其中官方提供5套开发套件,使用方法如下

        

        例如想安装默认套件,安装到当前目录的demo文件夹下

        quasar init default demo ,  然后进入demo目录npm install即可


二、开始使用

        1、quasar支持通过开发模式启动,支持热重载

        可以通过    quasar dev [theme] 来启动项目

        例如:

        quasar dev 或者 quasar dev mat 使用mat主题启动

        quasar dev ios 使用ios主题启动

        

        使用default套件安装启动后:

        quasar-framework学习笔记

        使用pwa套件安装启动后:

        quasar-framework学习笔记

        剩余的0.13版本,webpack1和vue1在此就不做赘述了

        另外发现非官方提供的这个meteor安装后 quasar dev会报错:

        quasar-framework学习笔记

      ,,

,,,,2、模板

,,,,,,,,一些通用页面框架,可以在根目录下的模板文件夹下提前写好,需要创建新页面时,直接通过类星体新(模板文件夹下的模板文件][文件名称]

,,,,,,使用默认套件搭建好项目后,模板下默认会给出三个模板、布局、页面组件,也可以自己在里写好。以布局举例:

,,,,,,,,类星体新的布局临时

,,,,,,,,  quasar-framework学习笔记

,,,,,,,,这是src/组件下就会多出一个根据布局模板创建好的temp.vue文件,文件的内容与布局页面一模一样

,,,,,,,,  quasar-framework学习笔记

,,,,,,,, 3,演示应用

,,,,,,,,通过启动时可以同时生成一个二维码

,,,,,,,,  quasar-framework学习笔记

,,,,,,,,手机扫描后可直接查看页面

,,,,,,,,  quasar-framework学习笔记

,,,,,,,,酷炫!

quasar-framework学习笔记