微信小程序真机调试无法读取 JSON 文件

[luxi78]

我在微信小程序中尝试读取项目中的 JSON 文件，代码如下：

      const path = "assets/animations/main_ani.json";
      const fs = wx.getFileSystemManager();
      try {
        // 读取本地 JSON 文件
        const fileContent = fs.readFileSync(path, "utf-8");
        let animData;
        try {
          animData = JSON.parse(fileContent);
          console.log(animData);
        } catch (e) {
          console.error("JSON 解析失败", e);
        }
      } catch (err) {
        console.error("读取文件失败", err);
      }

这段代码在 微信开发者工具 的 模拟器 中可以正常运行，但在 真机远程调试 时出现如下错误：

index.ts:69 读取文件失败 Error: readFileSync:fail no such file "assets/animations/main_ani.json"
    at W_ (WAServiceMainContext.js:1)
    at Object.<anonymous> (WAServiceMainContext.js:1)
    at I (WAServiceMainContext.js:1)
    at Object.p (WAServiceMainContext.js:1)
    at li.onTest (index.ts:60)
    at o.safeCallback (WASubContext.js:1)
    at WASubContext.js:1
    at wn (WASubContext.js:1)
    at WASubContext.js:1
    at pe (WASubContext.js:1)

尝试将 path 改为 "/assets/animations/main_ani.json" 之后，问题依旧。

疑问： 小程序的 JSON 文件应该如何正确读取？

开发者工具和真机调试的文件路径是否有差异？

是否需要特殊配置，或使用其他方式加载 JSON 文件？

希望有经验的朋友能帮忙解答，感谢！

[qhd1988]

考虑改成 js 文件,export 出来吧

[luxi78]

@qhd1988 这样做确实可以，但还是希望能找到最佳实践的方式，而不是用 trick 了。毕竟读取作为项目资源存在的 json 文件还是很常规的操作了，难倒大家都没有遇到过这样的需求吗？

[qhd1988]

@luxi78 #2 看起来你是想加载 lottie 动画?我们的动画都丢腾讯的 cos 上了,直接用 lottie.loadAnimation 加载出来

[gadfly3173]

看你代码好像没什么问题，真机调试不成功的话你得观察一下上传代码包时那个 popup 的内容，可能你这个 json 被忽略了，没有上传

[junan]

json 文件放在 static 目录下试试？

[duanxianze]

4#说的对，没有显式引用，可能上传的时候被忽略了

[wjfz]

我理解微信小程序的 FileSystemManager 读取的是手机系统的文件，不是代码包目录内的文件，所以这种使用姿势不对。

[miku999]

真机调试后可以去 devtools 的 source 面板里看看文件在不在

[harlen]

不能读项目内的 json 文件吧，上次写背单词小程序，为了省服务端，把字典放代码里面，最后只有 export 能正常读取到， 放项目内还有个大小限制开发工具好好的，上传上去就超大