"(双引号)遇上css-modules引发编译报错

Umi 2的环境

别人less文件的导入是这样的

@import '../../../utils/utils.less';
@import '~antd/lib/style/themes/default.less';

我拷贝过来改一下是这样的

@import "../../../utils/utils.less";

@import "~antd/lib/style/themes/default.less";
.title{
  color:@green-7;
 }

然后就报错了

Error [LessError: '../../../utils/utils.less' wasn't found. Tried - 
...
  message: "'../../../../../utils/utils.less' wasn't found. Tried - 
...
  stack: undefined,
  type: 'File',
  filename: 'input',
  index: 24368,
  line: 852,
  column: 0,
  callLine: NaN,
  callExtract: undefined,
  extract: [ '', '@import "../../../utils/utils.less";', '' ]
}

解决方案

把@import '../../../utils/utils.less';中的双引号换成单引号，我这里是保存自动格式化成"的，是csscomb 插件导致的

改成

"quotes":"single" 

就好了

下面鬼扯一下过程，个人认为比最终结果要重要的多

相对路径没对？我就从头到尾打了一遍，跟着目录提示走，再次编译还是不行...

我开始慌了，估计是配置方面的问题，那可就麻烦了...

于是乎我又奴性的想起来百度、谷歌，简单搜了一下觉得不对劲，我自己都不知道搜什么，过往的经验告诉我，这样很难解决问题。

大佬们都走了，这个问题似乎也不急，关键时候还是要靠自己。

我先机智的把@green-7 换成等价的16进制颜色，先把任务完成。

可能是神来之笔，我去可以的less 文件 改了个样式，编译报了类似的错误。

上帝的心态发生了一点点变化，我撤销、还原了好几次，只有单引号、双引号在变化...

用记事本单独打开了我的less 文件，把双引号都改成了单引号，再次编译成功了！

接下来就是找出哪个插件格式化的了

首先想到Prettier ，被禁用了还是会自动将' 转换为 "

想到setting.json，注意到了double，当时第一个想到还是百度一下这个配置都有什么值，转念一想，难道不是single

没想到晚上的美好时光给了双引号，谁又能想到"和' 会有这么大差别呢....

至此，我感觉自己任督二脉被打通了，程序员小遁的一大步!