Taro + Vite 开发中 fs.allow 配置问题分析与解决

想买Rolex和Supra的凯美瑞车主2025-09-10 13:56

在使用 Taro 官方脚手架初始化项目并选择 Vite 作为构建工具后，运行 npm run dev:h5 时可能会遇到如下报错：

javascript 复制代码

Failed to load url /app.ts (resolved id: D:/***/***/src/app.ts) in D:/***/***/src/app.config.ts. Does the file exist?
The request url "D:******\src\app.ts" is outside of Vite serving allow list.
- D:/***/***/node_modules/vite/dist/client

该错误是由于 Vite 开发服务器默认的安全策略限制所致，即不允许访问项目根目录之外的文件。尽管官方文档建议在 vite.config.ts 中通过 server.fs.allow 配置允许访问的路径，但在 Taro 项目中直接这样做往往无效。

根本原因 ：

Taro 项目若选用 @tarojs/vite-runner 作为编译器，并不会直接读取项目根目录下的 vite.config.ts，而是通过 Taro 自身的配置体系管理 Vite 行为。

解决方案 ：

需在 Taro 的配置文件 /config/index.ts 中针对 H5 模式进行如下配置：

css 复制代码

h5: {
  devServer: {
    fs: {
      allow: ['..'], // 允许向上访问父级目录
    },
  },
  // 其他原有配置...
}

注意事项 ：

该方法仅适用于在创建脚手架时选择 Vite 作为构建工具的情况。若使用的是 Webpack，可参考类似思路调整 devServer 配置，或查阅 Taro 官方文档进行相应设置。

通过以上调整，可解决因 Vite 安全策略导致的文件访问限制问题，确保开发服务器正常启动。