uni-app 引用公共模块提示文件查找失败

在 uni-app 项目中，如果你在引用公共模块时遇到“文件查找失败”的问题，可能是由于路径配置不正确或文件不存在导致的。以下是一些常见的排查和解决方法：

1. 检查文件路径

确保你引用的路径是正确的。uni-app 支持相对路径和绝对路径，建议使用相对路径来避免路径问题。

• 相对路径：./common/utils.js
• 绝对路径：@/common/utils.js（@ 表示项目根目录）

例如：

import utils from '@/common/utils.js'; // 绝对路径
import utils from './common/utils.js'; // 相对路径

2. 确保文件存在

检查你引用的文件是否真实存在于指定路径中。如果文件不存在，需要创建或修复路径。

3. 检查文件扩展名

在 uni-app 中，引用文件时需要明确指定文件扩展名（如 .js、.vue 等）。如果省略扩展名，可能会导致文件查找失败。

例如：

import utils from './common/utils.js'; // 正确
import utils from './common/utils'; // 可能失败

4. 检查 alias 配置

如果你使用了自定义的路径别名（如 @），确保在 vue.config.js 或 vite.config.js 中正确配置了别名。

例如，在 vue.config.js 中：

const path = require('path');

module.exports = {
  configureWebpack: {
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src'), // 将 @ 指向 src 目录
      },
    },
  },
};

5. 检查 node_modules 模块

如果你引用的是 node_modules 中的模块，确保模块已正确安装。可以通过以下命令安装缺失的模块：

npm install 模块名

6. 检查 uni-app 版本

某些 uni-app 版本可能存在路径解析的 Bug。尝试更新到最新版本：

npm install -g @vue/cli
npm install -g @dcloudio/uni-cli

7. 清理缓存并重启

有时缓存可能导致路径解析失败。尝试清理缓存并重启项目：

npm cache clean --force
npm run dev

8. 检查 eslint 或 tsconfig 配置

如果你使用了 eslint 或 TypeScript，确保它们的路径配置与项目一致。

例如，在 tsconfig.json 中：

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

9. 调试路径问题

如果问题仍然存在，可以在代码中打印路径，检查路径是否正确：

console.log(require.resolve('@/common/utils.js'));