Quasar CLI with Webpack - @quasar/app-webpack
BEX应用准备

生成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模式。

TIP

src-bex文件夹只是一个标准的浏览器扩展文件夹,因此您可以像使用任何其他浏览器扩展项目文件夹一样自由使用它。 请参考受支持的浏览器扩展文档以了解更多信息。

2. 了解src-bex的结构

新文件夹具有以下结构:

.
└── src-bex/
    ├── css                    # CSS to use in the Browser Context
    |   ├── content-css.css       # CSS file which is auto injected into the consuming webpage via the manifest.json
    ├── icons/                 # Icons of your app for all platforms
    |   ├── icon-16x16.png         # Icon file at 16px x 16px
    |   ├── icon-48x48.png         # Icon file at 48px x 48px
    |   └── icon-128x128.png       # Icon file at 128px x 128px
    ├── js/                    # Javascript files used within the context of the BEX.
    |   ├── background.js         # Standard background script BEX file - auto injected via manifest.json
    |   ├── background-hooks.js   # Background script with a hook into the BEX communication layer
    |   ├── content-hooks.js      # Content script script with a hook into the BEX communication layer
    |   ├── content-script.js     # Standard content script BEX file - auto injected via manifest.json
    |   └── dom-hooks.js          # JS file which is injected into the DOM with a hook into the BEX communication layer
    └── www/                   # Compiled BEX source - compiled from /src (Quasar app)
    └── manifest.json          # Main thread code for production

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