uni-app unpackage编译目录 h5目录名改为web后缺少静态文件

在 uni-app 项目中，如果你想将 H5 的编译输出目录从默认的 unpackage/dist/build/h5 改为 unpackage/dist/build/web，可能会遇到静态文件缺失的问题。这是因为 uni-app 在编译 H5 项目时，默认会生成一些静态文件（如 index.html、js、css 等），并且这些文件的路径是相对于默认的输出目录进行配置的。

如果你手动修改了输出目录名称，可能会导致部分路径配置错误，进而出现静态文件缺失的问题。

解决方案

1. 检查路径配置：

   • 确保在 manifest.json 或 vue.config.js 中正确配置了 H5 的输出路径。例如：

     // manifest.json
     {
       "h5": {
         "publicPath": "/web/", // 确保 publicPath 正确
         "outputDir": "unpackage/dist/build/web" // 修改输出目录
       }
     }

2. 手动复制静态文件：

   • 如果你已经编译了项目，可以手动将 unpackage/dist/build/h5 目录下的所有文件复制到 unpackage/dist/build/web 目录中，确保所有静态文件都存在。

3. 重新编译：

   • 在修改了输出目录后，建议重新编译项目，以确保所有文件都正确生成。你可以通过以下命令重新编译 H5 项目：

     npm run build:h5

4. 检查路由配置：

   • 如果你使用了 vue-router，确保路由配置的 base 属性与新的输出目录一致。例如：

     const router = new VueRouter({
       mode: 'history',
       base: '/web/', // 确保 base 与 publicPath 一致
       routes: [...]
     });

5. 服务器配置：

   • 如果你将项目部署到服务器，确保服务器正确配置了静态文件的路径。例如，在 Nginx 中：

     location /web/ {
         alias /path/to/your/project/unpackage/dist/build/web/;
         try_files $uri $uri/ /web/index.html;
     }