SPFx 1.21.1项目样式表无法找到问题求助

本地依赖重置 #

• 清理现有依赖后重新安装：
  1. 删除项目根目录下的node_modules文件夹
  2. 删除package-lock.json（或yarn.lock，根据你使用的包管理器选择）
  3. 执行npm install重新拉取依赖，安装时留意是否有依赖冲突报错，针对性处理

修复VS语言服务缓存与配置 #

• 重置VS的TypeScript语言服务：打开命令面板（Ctrl+Shift+P），输入TypeScript: Reset JavaScript/TypeScript Language Service执行，之后重启VS
• 暂时禁用非官方SPFx扩展：比如第三方样式检查类扩展，重启VS后测试问题是否消失

校验样式导入与配置 #

• 确认组件TS文件中样式表的导入路径完全匹配（注意大小写，VS语言服务对大小写敏感），示例：

  import styles from './MyComponent.module.scss';
  

• 检查tsconfig.json的include数组，确保包含样式文件路径：

  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.scss"
  ]
  

切换Node.js版本测试 #

• 尽管官方标注兼容v22 LTS，但可临时切换到Node.js v20 LTS（用nvm等版本管理工具），重新安装依赖或创建新项目验证问题是否存在

重新指定SPFx生成器版本 #

• 先卸载全局的生成器：npm uninstall -g @microsoft/generator-sharepoint
• 重新安装指定的1.21.1版本：npm install -g @microsoft/generator-sharepoint@1.21.1
• 用这个版本重新创建项目测试

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