Vue3 + Quasar系列-代码配置以及报错汇总记录(不断更新中)

1. Vue3 + Quasar系列-代码配置打包去掉hash后缀

去掉hash
https://quasar.dev/quasar-cli-vite/developing-pwa/configuring-pwa
Vue3 + Quasar系列-代码配置以及报错汇总记录(不断更新中)_第1张图片

2. Vue3 + Quasar改变主题背景

quasar的样式和其他的框架修改不太一样,需要我们使用动态的方式来进行变更,一般来说有两种方案进行主题修改

方案一:

  • 修改样式所需文档:
  • 这里是样式修改的说明:https://quasar.dev/style/color-palette#how-it-works
  • 这里有大量的默认样式声明:https://quasar.dev/style/sass-scss-variables
    Vue3 + Quasar系列-代码配置以及报错汇总记录(不断更新中)_第2张图片

Vue3 + Quasar系列-代码配置以及报错汇总记录(不断更新中)_第3张图片

废话不多说,直接上代码:





方案二:

  • 新建文件:src\css\quasar.variables.scss
  • 写入下面代码:
$primary   : #1976D2;
$secondary : #26A69A;
$accent    : #9C27B0;

$dark      : #1D1D1D;

$positive  : #21BA45;
$negative  : #C10015;
$info      : #31CCEC;
$warning   : #F2C037;

以上两种方式混用的话,方案一代码会替代掉方案二代码的重复颜色得哦~~~

欢迎大家指出文章需要改正之处~
学无止境,合作共赢
Vue3 + Quasar系列-代码配置以及报错汇总记录(不断更新中)_第4张图片

欢迎路过的小哥哥小姐姐们提出更好的意见哇~~

你可能感兴趣的:(前端必备,vue,javascript,typescript)