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

在使用 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 安全策略导致的文件访问限制问题,确保开发服务器正常启动。

相关推荐
Filotimo_5 小时前
2.CSS3.(2).html
前端·css
yinuo6 小时前
uniapp微信小程序华为鸿蒙定时器熄屏停止
前端
gnip7 小时前
vite中自动根据约定目录生成路由配置
前端·javascript
前端橙一陈8 小时前
LocalStorage Token vs HttpOnly Cookie 认证方案
前端·spring boot
~无忧花开~9 小时前
JavaScript学习笔记(十五):ES6模板字符串使用指南
开发语言·前端·javascript·vue.js·学习·es6·js
泰迪智能科技019 小时前
图书推荐丨Web数据可视化(ECharts 5)(微课版)
前端·信息可视化·echarts
CodeCraft Studio9 小时前
借助Aspose.Email,使用 Python 读取 Outlook MSG 文件
前端·python·outlook·aspose·email·msg·python读取msg文件
家里有只小肥猫11 小时前
react 初体验2
前端·react.js·前端框架
慧慧吖@11 小时前
前端发送请求时,参数的传递格式
前端
L李什么李11 小时前
HTML——使用表格制作简历
前端·javascript·html