运行代码触发VM10:182 crbug/1173575报错：非JS模块文件已废弃

这个报错是Chrome浏览器废弃了旧的非JS模块文件处理方式导致的，以下是具体解决办法：

• 修正非JS模块的导入语法
  若你在ES模块中直接导入CSS、JSON等非JS资源，需使用浏览器原生支持的断言语法明确资源类型：

  • 导入CSS：

    import './styles.css' assert { type: 'css' };
    

  • 导入JSON：

    import data from './data.json' assert { type: 'json' };
    

  这种语法符合ES模块的标准规范，不会触发废弃警告。

• 使用构建工具打包资源
  对于复杂项目，建议使用Webpack、Vite或Rollup等构建工具。这类工具会自动处理非JS模块的转换与打包，比如将CSS注入页面、将JSON转换为JS对象，无需手动修改导入语法，同时还能提升代码兼容性和性能。

• 临时禁用警告（不推荐长期使用）
  若只是需要临时隐藏警告，可在启动Chrome时添加命令行参数：

  --disable-blink-features=NonJsModuleFileDeprecation
  

  注意：这只是临时方案，无法解决根本问题，建议优先规范代码。

• 升级或替换问题第三方依赖
  部分旧版第三方依赖可能使用了废弃的非JS模块导入方式。检查项目依赖的版本，升级到最新稳定版；若升级后仍存在问题，可考虑替换为符合现代ES模块规范的替代库。

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