如何禁用Quasar应用自带的默认quasar.css样式文件？

可以通过官方内置配置项彻底移除默认的全量quasar.css注入，不需要手动修改打包产物。之前检索不到对应说明，是因为官方把相关配置分散在框架配置的不同小节中，没有单独设置“禁用全量quasar.css”的独立文档入口，并非该操作无法实现。

具体配置步骤 #

打开项目根目录下的quasar.config.js（或TypeScript版本的quasar.config.ts），按顺序修改以下配置项：

• 调整framework配置段的引入策略：
  • 将framework.importStrategy设为'manual'，清空所有不需要引入的Quasar组件、指令、插件列表，从根源上避免因为全量引入UI组件，连带把对应的12000行组件样式全部打包进产物。
  • 在framework.config配置块中添加cssReset: false，关闭Quasar默认无开关注入的全局CSS重置规则。
  • 在framework配置顶层添加cssAddon: false，关闭Quasar默认引入的通用UI辅助样式块。
• 校验打包结果：
  执行本地项目启动命令后，打开浏览器开发者工具的网络面板，过滤css资源请求，确认没有出现独立的quasar.css文件被加载即可。

注意事项 #

• 如果你完全不使用任何Quasar提供的UI组件逻辑，上述配置完成后不会残留任何Quasar内置的样式规则。
• 禁用默认CSS重置后如果出现跨浏览器的样式表现差异，手动编写几行自定义的全局reset规则即可覆盖需求，不需要保留Quasar的那部分基础样式逻辑。
• 如果后续需要复用部分Quasar组件的交互逻辑但不想引入自带样式，不要直接全量禁用CSS，需要通过CSS作用域隔离的方式，把组件自带的样式限制在独立的组件作用域内，避免污染全局样式。

内容的提问来源于stack exchange，提问作者Dan Knights