Vuetify.js：v-stepper中的color prop在Gitlab上部署时不会生效。如何将颜色道具移至CSS类？

Question

使用Vuetify.js v-stepper组件，我可以使用v-stepper-step道具来更改color的颜色：

<v-stepper-step :complete="e1 > 2" color="red" step="2">Name of step 2</v-stepper-step>

当我在Nuxt.js中使用Vuetify并在本地启动服务器时，此方法工作正常。但是我注意到，当我在Gitlab上部署应用程序时，颜色道具不起作用，并且检查有问题的元素只是显示了一种空样式：

element.style {
}

这就是为什么我尝试使用类的原因：

<v-stepper-step :complete="e1 > 1" step="1" class="step-number">Name of step 1</v-stepper-step>

这是CSS类：

.step-number {
  background-color: yellow;
  color: red;
}

我这样做是希望从CSS类中操作颜色道具，然后再次部署在Gitlab上以查看输出，但是，即使在本地也无法使用。

如何克服这个问题？

Codepen。

Answer 1

CSS color https://github.com/tensorflow/tfjs-node#optional-build-libtensorflow-from-tensorflow-source用于设置文本样式。它与vue属性color不同。

您可以使用（property）：

.step-number > .v-stepper__step__step{
  background-color: red !important;
  border-color: red !important;
}