heroku 中的 vue-cli-service 构建失败

Posted 2023-02-18

【中文标题】heroku 中的 vue-cli-service 构建失败

【英文标题】：vue-cli-service build failing in heroku

【发布时间】：2021-07-24 15:48:01

【问题描述】：

我有一个很基础的应用，默认的vue-cli设置+一些组件和视图。

该应用程序是在本地构建的 vue-cli-service build 工作正常，但是当我尝试在 heroku 上部署它时失败并出现以下错误，

构建

运行构建

roh@1.0.0 build /tmp/build_9945eaec

vue-cli-service 构建

为生产而构建...

ERROR 编译失败，出现 1 个错误4:21:05 PM

未找到此相关模块：

ERROR 构建失败并出现错误。 * ../assets/Logo.png 在 ./node_modules/cache-loader/dist/cjs.js?"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"6212392d-vue-loader -template"!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0! ./node_modules/vue-loader/lib??vue-loader-options!./src/components/Header.vue?vue&type=template&id=2778e676&scoped=true& npm 错误！代码 ELIFECYCLE npm 错误！ errno 1 npm 错误！ roh@1.0.0 构建： vue-cli-service build npm 错误！退出状态 1 npm ERR！ npm 错误！ roh@1.0.0 构建脚本失败。 npm 错误！这可能不是一个 npm 的问题。上面可能有额外的日志输出。 npm 呃！可以在以下位置找到此运行的完整日志：npm ERR！ /tmp/npmcache.fDHth/_logs/2021-05-01T16_21_06_022Z-debug.log

-----> 构建失败

编辑：

这很奇怪，唯一一次构建失败是当我尝试在我的header 组件中添加一个img 标记时。 sn-p 很直接，

<router-link to="/" class="flex title-font font-medium items-center text-gray-900 mb-4 md:mb-0">
    <svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke- class="w-10 h-10 text-white p-2 bg-secondary rounded-full" viewBox="0 0 24 24">
        <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"></path>
    </svg>
    <!-- <img class="logo" src="@/assets/Logo.png"  srcset="" /> -->
    <span class="ml-3 text-xl text-primary">Recipe of Hope</span>
</router-link>

如果我取消注释 img 标记，构建将失败。

【参考方案1】：

奇怪的是，当我更新它时，vscode/git 并没有更改图像（从 logo.png 到 Logo.png）。

事实证明，Mac 文件系统不区分大小写，但 Linux/Windows 区分大小写，问题可能难以追踪，但一旦您看到几次就很容易发现。

问题是由于大小写不匹配，在我完全更改图像名称然后恢复为 Logo.png 后它起作用了。