Vue Electron项目中SCSS报SassError: Expected spaces, was tabs的解决方法

直接修复当前错误 #

你的SCSS代码混用了制表符（Tab）和空格缩进，还存在部分嵌套层级错误（比如#logo下的width没有正确缩进），导致Sass编译报错。按以下步骤修正：

1. 把代码中所有制表符（Tab）替换为空格，建议每个嵌套层级统一用2或4个空格。
2. 修正嵌套层级，确保子选择器相对于父选择器正确缩进。修正后的代码示例：

#nav 
  background-color: white
  #logo 
    width: 30px    
  #preloaderWrapper 
    position: fixed
    top: 30%
    left: 50%
  #menu-icon 
    font-size: 2em
  #main 
    margin-top: 8em
  #search-box 
    width: 520px
  #theme-switcher 
    width: 600px
  .progress
    margin-top: 35em

避免后续再出现该问题 #

• 编辑器设置：将默认缩进设为空格，比如VS Code中开启editor.insertSpaces，并设置editor.tabSize为2或4，确保按下Tab键时自动插入空格。
• 添加.editorconfig文件到项目根目录，统一项目缩进规则，示例内容：

root = true

[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

• 提交代码前用stylelint等lint工具检查缩进，提前发现格式问题。

内容的提问来源于stack exchange，提问作者OHICT