ant-design / ant-design-pro

👨🏻‍💻👩🏻‍💻 Use Ant Design like a Pro!
https://pro.ant.design
MIT License
36.35k stars 8.14k forks source link

🐛 [BUG] File was processed with these loaders: #11141

Closed Dssssds closed 7 months ago

Dssssds commented 7 months ago

🐛 bug 描述

报错信息如何: `ERROR in ../backend/src/shared/protocols/serviceProto.ts 21:7 Module parse failed: Unexpected token (21:7) File was processed with these loaders:

webpack compiled with 1 error`

📷 复现步骤 | Recurrence steps

1。 引入了第三方的依赖库。 2。 使用依赖库,既可出现以上报错信息。

tsconfig 配置如下 { "compilerOptions": { "outDir": "build/dist", "module": "esnext", "target": "esnext", "lib": ["esnext", "dom"], "sourceMap": true, "baseUrl": ".", "jsx": "react-jsx", "resolveJsonModule": true, "allowSyntheticDefaultImports": true, "moduleResolution": "node", "forceConsistentCasingInFileNames": true, "noImplicitReturns": true, "noUnusedLocals": true, "allowJs": true, "skipLibCheck": true, "experimentalDecorators": true, "strict": true, "paths": { "@/*": ["./src/*"], "@@/*": ["./src/.umi/*"] } }, "include": [ "mock/**/*", "src/**/*", "playwright.config.ts", "tests/**/*", "test/**/*", "__test__/**/*", "typings/**/*", "config/**/*", ".eslintrc.js", ".stylelintrc.js", ".prettierrc.js", "jest.config.js", "mock/*" ], "exclude": ["node_modules", "build", "dist", "scripts", "src/.umi/*", "webpack", "jest"] }

安装依赖: npm i tsrpc-browser

目录路劲如下: 引入shared 的接口协议文件就出错了。 image

© 版本信息

chenshuai2144 commented 7 months ago

值得注意是的百分之二十的问题都可以用重装依赖来解决,所以你可以尝试一下: 删除 'node_modules' 文件夹 -> 删除 'package-lock.json'或 'pnpm-lock.yaml' 文件 -> 运行 'pnpm install' 或 'npm install' 命令

首先,根据报错信息,问题出现在../backend/src/shared/protocols/serviceProto.ts文件中的第21行,报错信息提示文件被以下loader处理:

./node_modules/umi/node_modules/@umijs/preset-built-in/bundled/@pmmmwh/react-refresh-webpack-plugin/loader/index.js

并且可能需要额外的loader来处理这些loader处理结果。

解决方案:

  1. 第一步,检查../backend/src/shared/protocols/serviceProto.ts文件的第21行,确保语法正确。

  2. 如果语法正确,由于报错信息中提到了umi和react-refresh-webpack-plugin,可以考虑以下方案:

    • 清理缓存并重新安装依赖,可以使用以下命令:

      npm cache clean --force
      rm -rf node_modules
      npm install
    • 确保使用的是最新版本的node.js,可以尝试升级node版本。

    • 如果报错依然存在,可以尝试升级umi和antd的版本,使用以下命令:

      npm update umi antd
    • 如果以上方法都无效,可以考虑按需引入所需的loader。根据报错信息中提到的loader路径./node_modules/umi/node_modules/@umijs/preset-built-in/bundled/@pmmmwh/react-refresh-webpack-plugin/loader/index.js,查看是否存在该loader的配置文件,并在webpack配置文件中添加相应的loader。

  3. 如果以上方法均未解决问题,可以尝试检查相关依赖库的文档或在相关社区论坛上提问,以寻求更多的帮助。

注意:在进行任何操作之前,请确保你已经备份了项目代码,并且明白每个操作的风险和影响。