idea自动编译scss为啥会生成.map

Posted 2023-04-30

参考技术A 导入.sass或.scss文件 css有一个不太常用的特性，即@import导入功能，它允许在一个css文件中导入其他css文件。然而，结果是只有执行到@import规则时，浏览器才会去下载其他css文件本回答被提问者采纳

scss map-isset（）地图测试工具 - 由SassMeister.com生成。

/* @function map-isset()

Sometimes we need to test if a map is really set. 
Testing with variable_exist is not enought, cause if map is empty it return true
Type-of return false if the map is empty

For example in my icon-set component
https://gist.github.com/mistergraphx/dfc1c57bd7d202bf1464
, the theme _globals must define a icon-set variable map containing :
$icon-set: (
  'icon': 'hex code'
);

@author - Arnaud B. (Mist. GraphX)
@url - http://www.mister-graphx.com
@see  - http://sass-lang.com/documentation/Sass/Script/Functions.html
@param $input - 
@return - what you want ;-) sting or boolean
*/
.selector {
  color: "Hey your variable is not a map or there is no key, value defined";
  color: "Hey your variable is not a map or there is no key, value defined";
  color: "This is a map with 1index set";
}

// ----
// libsass (v3.2.5)
// ----

/* @function map-isset()

Sometimes we need to test if a map is really set. 
Testing with variable_exist is not enought, cause if map is empty it return true
Type-of return false if the map is empty

For example in my icon-set component
https://gist.github.com/mistergraphx/dfc1c57bd7d202bf1464
, the theme _globals must define a icon-set variable map containing :
$icon-set: (
  'icon': 'hex code'
);

@author - Arnaud B. (Mist. GraphX)
@url - http://www.mister-graphx.com
@see  - http://sass-lang.com/documentation/Sass/Script/Functions.html
@param $input - 
@return - what you want ;-) sting or boolean
*/
$string-variable: "I'm a String";
$empty-map-variable: ();
$filled-map-variable: (
  'key':'value'
);

@function map-isset($input){
  // Is it a map type variable ?
  // Type-of() return false if the map is empty
  // so we convert the number of keys to a list
  // and use lenght to test the number of keys
  @if((type-of($input) == 'map') and (length(map-keys($input)) > 0)){
      $num-of-keys: length(map-keys($input));
      @return "This is a map with " + $num-of-keys + "index set";
  }
  @else {
    @return "Hey your variable is not a map or there is no key, value defined";
  }
}

.selector {
  color: map-isset($string-variable);
  color: map-isset($empty-map-variable);
  color: map-isset($filled-map-variable);
}