Quasar CLI with Vite - @quasar/app-vite
构建 SPA、Mobile App、Electron App、BEX 或 SSR 之间的区别仅仅是由 quasar dev 和 quasar build 命令中的 mode 参数决定的。
添加 Quasar BEX 模式
为了构建一个 BEX,首先要在项目中添加 BEX 模式:
$ quasar mode add bexcontent_paste
如果您想直接开始开发,也可以跳过 “quasar mode” 命令,直接使用:
$ quasar dev -m bex -T [chrome|firefox]content_paste
这样,如果项目缺少 BEX 模式,则会自动添加,项目中会新建一个 /src-bex 目录。
TIP
src-bex 文件夹只是一个标准的浏览器插件项目文件夹,因此您可以像使用任何其他浏览器插件项目文件夹一样自由使用它。请参阅支持的浏览器插件文档以了解更多信息。
- Firefox 浏览器插件文档
- Google Chrome 浏览器插件文档
- 其他基于 Chromium 的浏览器 - 参考他们各自的文档。
“/src-bex” 解析
新文件夹具有以下结构:
src-bex/
assets/
content.css
# CSS file which is auto injected into the consuming webpage via the manifest.json
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
background.js
# (or .ts) Standard background script BEX file (auto injected via manifest.json)
my-content-script.js
# (or .ts) Standard content script BEX file - auto injected via manifest.json (you can have multiple content scripts)
下一节将更详细地讨论这些内容。