QUasar(安装及目录结构)

董砚
2023-12-01

Quasar 中文文档连接点击这里

Quasar 安装

# Node.js> = 8.9.0是必需的。

$ yarn global add @quasar/cli
# 或者
$ npm install -g @quasar/cli

创建项目

$ quasar create <folder_name>

项目的目录结构

.quasar文件                  #此文件是自动生成的。不要编辑。您可能正在寻找添加启动/初始化代码。使用“quasar new boot<name>”并将其添加到此处。每个问题一个启动文件。然后引用quasar.conf.js>boot中的文件:boot:['file',…]//不要给它添加“.js”扩展名。启动文件是你的“main.js”
.
├── src/
│   ├── assets/              # 动态资源(由webpack处理)
│   ├── statics/             # 纯静态资源(直接复制)
│   ├── components/          # 用于页面和布局的.vue组件
│   ├── css/                 # CSS/Stylus/Sass/...文件
|   |   ├── app.styl
|   │   └── quasar.variables.styl # 供您调整的Quasar Stylus变量
│   ├── layouts/             # 布局 .vue 文件
│   ├── pages/               # 页面 .vue 文件
│   ├── boot/                # 启动文件 (app initialization code) 
│   ├── router/              # Vue路由
|   |   ├── index.js         # Vue路由定义
|   │   └── routes.js        # App路由定义
│   ├── store/               # Vuex Store
|   |   ├── index.js         # Vuex Store 定义
|   │   ├── <folder>         # Vuex Store 模块...
|   │   └── <folder>         # Vuex Store 模块...
│   ├── App.vue              # APP的根Vue组件
│   └── index.template.html  # index.html模板
├── src-ssr/                 # SSR特定代码(就像生产环境的Node网页服务器)
├── src-pwa/                 # PWA特定代码(如Service Worker)
├── src-cordova/             # Cordova生成的文件夹用于创建移动APP
├── src-electron/            # Electron特定代码(如"main"线程)
├── dist/                    # 生产版本代码,用于部署
│   ├── spa/                 # 构建SPA的例子
│   ├── ssr/                 # 构建SSR的例子
│   ├── electron/            # 构建Electron的例子
│   └── ....
├── quasar.conf.js           # Quasar App配置文件
├── babel.config.js          # Babeljs配置
├── .editorconfig            # editor配置
├── .eslintignore            # ESlint忽略路径
├── .eslintrc.js             # ESlint配置
├── .postcssrc.js            # PostCSS配置
├── .stylintrc               # Stylus lint配置
├── .gitignore               # GIT忽略路径
├── package.json             # npm脚本和依赖项
└── README.md                # 您的网站/应用程序的自述文件

启动项目

# 运行开发服务器(使用默认主题)
$ quasar dev

# 运行在特定端口
$ quasar dev -p 9090

# SSR
$ quasar dev -m ssr

# PWA
$ quasar dev -m pwa

# 手机应用
$ quasar dev -m cordova -T [android|ios]
# 或更短的格式:
$ quasar dev -m [android|ios]

# Electron应用
$ quasar dev -m electron

# 将额外的参数和/或选项传递给
# 底层“cordova”或“electron”可执行文件:
$ quasar dev -m ios -- some params --and options --here
$ quasar dev -m electron -- --no-sandbox --disable-setuid-sandbox

清理构建资源

$ quasar clean
 类似资料: