生成SPA、移动应用、Electron应用、BEX或SSR之间的区别仅由“quasar dev”和“quasar build”命令中的“mode”参数确定。

1. 添加Quasar BEX模式

为了构建BEX，我们首先需要将BEX模式添加到我们的Quasar项目中：

$ quasar mode add bex

如果您想直接进入并开始开发，则可以跳过“quasar mode”命令并发出：

$ quasar dev -m bex

如果项目未添加src-bex文件夹，它将自动添加BEX模式。

2. 了解src-bex的结构

新文件夹具有以下结构：

.
└── src-bex
    ├── assets
    │   └── content.css       # CSS file which is auto injected into the consuming webpage via the manifest.json
    ├── background.js         # Standard background script BEX file
    │                             # auto injected via manifest.json
    ├── dom.js                # JS file which is injected into the DOM with a hook into the BEX communication layer
    ├── icons                 # Icons of your app for all platforms
    │   ├── icon-128x128.png  # Icon file at 128px x 128px
    │   ├── icon-16x16.png    # Icon file at 16px x 16px
    │   └── icon-48x48.png    # Icon file at 48px x 48px
    ├── _locales              # Optional BEX locales files that you might define in manifest
    ├── manifest.json         # The browser extension manifest file
    └── my-content-script.js  # Standard content script BEX file - auto injected via manifest.json
                              # (you can have multiple content scripts)

下一章节将更详细地讨论这些内容。