Vercel webpack module resolution error

🙋Get Help
1

Hey everyone,

New to the community so appreciate patience with me :slight_smile:. I have a relatively new project set up for a hobby site (I’d prefer to keep it private but can grant specific access to someone who would like to help investigate).

The particular issue I’m having is with the Vercel integration at build-time. When I allow the Github integration to run, the Vercel deploy fails to build the ES5 module for a module resolution error:

Error: ./packages/lfs-pottery/src/components/Theme.tsx
Module not found: Error: Can't resolve './Title' in '/vercel/path1/packages/lfs-pottery/src/components'
resolve './Title' in '/vercel/path1/packages/lfs-pottery/src/components'
  using description file: /vercel/path1/packages/lfs-pottery/package.json (relative path: ./src/components)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: /vercel/path1/packages/lfs-pottery/package.json (relative path: ./src/components/Title)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        /vercel/path1/packages/lfs-pottery/src/components/Title doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        /vercel/path1/packages/lfs-pottery/src/components/Title.js doesn't exist
      .jsx
        Field 'browser' doesn't contain a valid alias configuration
        /vercel/path1/packages/lfs-pottery/src/components/Title.jsx doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        /vercel/path1/packages/lfs-pottery/src/components/Title.ts doesn't exist
      .tsx
        Field 'browser' doesn't contain a valid alias configuration
        /vercel/path1/packages/lfs-pottery/src/components/Title.tsx doesn't exist
      as directory

Interestingly, local build+serving works. If I run the vercel CLI, it deploys completely fine. This only occurs when I rely on pushing to the main branch and letting the vercel integration run from there.

Appreciate any tips! I noticed Frontity added webpack extensibility this year (which is awesome!). I’d just want to check if I need to rely on it as this seems like it could be caused from something else.

2

Aha! There has to be a quality of figuring it out immediately after you post. Ultimately this was a casing issue. OSX treats file names as case insensitive, so even though I thought I had upper-cased the tsx files, my actual git tree shows them as still lowercase.

Using git mv to upper-case them in Git did the trick. Builds are fixed now!

Credit where credit is due: