根据环境变量使用不同的.styl

时间:2020-04-10 15:42:17

标签: vue.js themes stylus quasar-framework

我正在构建带有白色标签的应用程序,该外观应根据业务客户端而有所不同。每个客户端都有自己的内部版本,该内部版本托管在不同的域中。

因此,我想更改Quasar构建的.styl文件以适应特定的品牌颜色。 我不想使用setBrand(),因为IE11是必需的。

我正在使用QENV来设置环境变量,但是可以打开任何东西。

我想做这样的事情:

css: [
      `${process.env.QENV.client}.styl`
    ]

其中QENV.client是标识特定客户端的字符串。

这不起作用,因为process.env.QENV目前不可用。在理想的情况下,它只应构建所需的文件,而不能在运行时进行区分。

我考虑过的事情

  • NormalModuleReplacementPlugin:我认为我可能只是在构建过程中替换了实际文件。我无法按照自己的意愿去做,这很可能会破坏热装,这将是(可忍受的)麻烦
  • vue-emotion:似乎并不是Quasar真正想要的方式,并且不需要Emotion可以做的很多工作
  • vue-styled-components:很棒的库,但与Quasar的融合不太好,因为您几乎可以重新创建例如按钮。我没办法接受现有的Quasar飞机。
  • 忽略类星体颜色,并通过JS提供自己的主题颜色:感觉很脏。一旦我想包含自定义字体,这也无济于事。
  • 在运行时需要不同的CSS:我想避免已编译的包中包含不必要的内容

如何让Quasar捆绑并使用正确的CSS文件?

0 个答案:

没有答案