element更换主题色sass 版本出现大量警告的坑

大家好,我是yang,最近在项目中有一个需求(使用的是nuxt框架)，是更换所有使用了element按钮的颜色，然后我就仔细阅(摸)读(鱼)了一下，发现在element文档中有一个自定义主题的选项，大大简短了开发的时间(又可以摸鱼了)，马上照着文档上手使用，修改完发现，项目在运行的时候出现了大量的警告，具体如下：

一开始发现这个警告并不影响使用，所以不想去理他，奈何他太影响美观，主管不满意了，让我抓紧处理

好吧，没办法，只能开始处理了。要解决问题，先要找到问题，首先是寻找这些警告出现的原因，原因找的还是比较快的，翻译一下就能知道是sass升级了，废除了 / 的使用，然后使用element自定义主题的时候，还是会用到 / ，所以才会报异常

既然问题找到了，那么我们来寻找解决的办法：

一开始在网上看到的解决方法是，直接在package.json文件里修改你的sass为"sass": "~1.32.6"，就不会报错了，我心想，这么简单就解决了？那不是又可以摸鱼了，果不其然，没用！

后面经过我坚持不懈的寻找，终于找到了有效的解决办法，分享给大家：

1. in your package.json add // 本人翻译(小菜鸡)：在你的package.json文件中添加下面的代码

"preinstall": "npx npm-force-resolutions"

inside the scripts section // 在package.json文件下的scripts部分添加下面代码

2. add

"resolutions": {
  "sass": "1.32.12"
},

below your scripts section // 类似于分割

3. after that run command npm i after finish run again your project and voila the error was gone // 添加完成只有运行npm i就完成拉

if you dont understand my step this my package.json

// 下面是他的package.json的文件结构

"scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "preinstall": "npx npm-force-resolutions" // preinstall goes here
  },
  "resolutions": {   // resolutions goes here
    "sass": "1.32.12"
  },
  "dependencies": {
  // some dependencies
  }

after that run command npm i or npm install after finish run again your project // 在运行完成npm i 或者 npm install 后运行你的项目就可以拉

附上github链接：https://github.com/nuxt-community/vuetify-module/issues/446

get到的老哥的评论:

觉得有用的可以点个赞呀，谢谢！