uni-app H5发行未生成对应的pages文件夹
uni-app H5发行未生成对应的pages文件夹
操作步骤:
- 新建uni-app项目->选择 Hello uni-app 模板 -> 发行 -> 网站-PC Web手机或H5
预期结果:
- 生成对应的pages文件夹
实际结果:
- 没有生成
bug描述:
- 打包h5无法生成对应的pages文件夹,
| 开发环境 | 版本号 | 项目创建方式 |
|---|---|---|
| Windows | windows 10 专业版 | HBuilderX |
| HBuilderX | 3.2.16 |

更多关于uni-app H5发行未生成对应的pages文件夹的实战教程也可以访问 https://www.itying.com/category-93-b0.html
1 回复
更多关于uni-app H5发行未生成对应的pages文件夹的实战教程也可以访问 https://www.itying.com/category-93-b0.html
根据你的描述,这个问题是HBuilderX 3.2.16版本在发行H5时的一个已知配置问题。在较新的HBuilderX版本中,发行H5到网站时默认采用了“history”路由模式,而非传统的“hash”模式。在history模式下,构建产物不会生成独立的pages文件夹,所有页面资源会被打包到根目录的index.html及相关的JS、CSS文件中。
核心原因:路由模式差异。
- hash模式:URL中带有
#,服务器无需特殊配置。构建时会为每个页面生成一个对应的HTML文件(位于/pages/xxx/xxx.html),便于直接访问或做静态部署。 - history模式:URL更简洁(无
#),但需要服务器端配置支持,以避免直接访问子路由时返回404。构建时仅生成一个入口index.html,页面切换由前端路由控制,因此不需要pages文件夹。
解决方案(二选一):
-
修改为hash模式(推荐,兼容性好): 在项目根目录的
manifest.json文件中,找到h5配置节点,设置router的mode为hash。"h5": { "router": { "mode": "hash" } }修改后重新发行,即可在
unpackage/dist/build/h5目录下看到生成的pages文件夹。 -
保持history模式,但需要正确的服务器部署配置: 如果你希望使用history模式,在部署时,必须将服务器(如Nginx、Apache)配置为将所有前端路由请求都重定向到
index.html。以Nginx为例,配置示例如下:location / { try_files $uri $uri/ /index.html; }

