關於vant的定制主題問題

　　最近在學習vant ui庫的時候，發現官網對定制主題的內容講的不是很詳細。

　　對相當瑜小白的我在學習過程中造成了很大的困擾。翻閱了很多資料，發現網上對這個介紹描述的很少。決定寫下這篇文章

　　先看一下官網上的說明：

　

　　先讓我們使用postcss-theme-variables這個插件，但並沒又說具體要怎么使用，藍色的字看起來像一個鏈接，點進去看發現是一大串的英文，看起來像是yarn的使用方法，好像貌似用不上；

 

　　那么既然是postcss插件，就應該先知道postcss插件一般是怎么使用的，然后我進行了查閱發現了一片文章 vue中怎么使用postcss  https://blog.csdn.net/weixin_38578293/article/details/79654656
　　按照上面的鏈接進行了安裝。

　　然后再回到官網說是需要再postcss.config.js中寫下配置，發現壓根沒有這個配置文件，新建一個發現毛用沒有。

　　反而發現main.js中引入的那些css出現問題

可以發現游覽器壓根不識別&這種語法

最后我抱着試一試的心里將他寫入了自動生成的.postcssrc.js文件中

module.exports = {
  "plugins":  [
      require('postcss-theme-variables')({
          vars: {
              red: '#F60',
              gray: '#CCC',
              blue: '#03A9F4'
          },
          prefix: '$'
      }),
      require('precss')(),
      require('postcss-calc')(),
      require('autoprefixer')({
          browsers: ['Android >= 4.0', 'iOS >= 7']
      })
  ]
}

　　然后發現編譯成功了，這些帶有$符號的css被編譯成功了。

　　雖然顏色的覆蓋好像並沒有起作用。但是只要直接修改var.css里的變量的值就能達到相同的效果了。暫時沒有想到更好的辦法期待補全和大神的幫助