Gatsby website Build works in local but fails on Netlify because of video import

[wow_studio]

using gatsby 5
netlify deployment message (I’ve shortened the message)

4:01:03 PM: $ gatsby build
4:01:19 PM: success write out requires - 0.006s
4:01:24 PM: failed Building production JavaScript and CSS bundles - 4.848s
4:01:24 PM: error Generating JavaScript bundles failed
4:01:24 PM: Can’t resolve ‘./…/video/wow-studio-hd.mp4’ in ‘/opt/build/repo/src/pages’
4:01:24 PM: If you’re trying to use a package make sure that ‘./…/video/wow-studio-hd.mp4’ is installed. If you’re trying to use a local file make sure that the path is correct.
4:01:24 PM: “build.command” failed ────────────────────────────────────────────────────────────────
4:01:24 PM: Error message
4:01:24 PM: Command failed with exit code 1: gatsby build (Search results for '"non-zero exit code: 1"' - Netlify Support Forums)
4:01:24 PM: Error location
4:01:24 PM: In Build command from Netlify app:
4:01:24 PM: gatsby build
4:01:24 PM: ​
4:01:24 PM: Resolved config
4:01:24 PM: build:
4:01:24 PM: command: gatsby build
4:01:24 PM: commandOrigin: ui
4:01:24 PM: publish: /opt/build/repo/public
4:01:24 PM: publishOrigin: ui
4:01:25 PM: Failed during stage ‘building site’: Build script returned non-zero exit code: 2 (Search results for '"non-zero exit code: 2"' - Netlify Support Forums)
4:01:24 PM: plugins:
4:01:24 PM: - inputs: {}
4:01:24 PM: origin: ui
4:01:24 PM: package: ‘@netlify/plugin-gatsby’
4:01:24 PM: redirects:
4:01:25 PM: - from: /api/* status: 200 to: /.netlify/functions/__apiCaching artifacts
4:01:25 PM: Started saving node modules
4:01:25 PM: Finished saving node modules
4:01:25 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
4:01:25 PM: Failing build: Failed to build site
4:01:25 PM: Finished processing build request in 41.29s`

the page where I am importing the video:

import React from "react"
import type { PageProps } from "gatsby"
import videoHDmp4 from "./../video/wow-studio-hd.mp4";
import Layout from "../components/Layout"

const IndexPage: React.FC<PageProps> = ({data}: any) => {

    return (
        <Layout>
            <video poster="/bg-texture-min.webp" controls={false} preload="auto" muted={true} autoPlay={true} loop={true} style={{width: "100%", height: "100%"}}>
                <source src={videoHDmp4} type="video/mp4"/>
                <source src="/wow-studio-hd.ogg" type="video/ogg"/>
            </video>
        </Layout>
    )
}

export default IndexPage;

folder structure:
>public
>src
   >pages
         >index.tsx
   >video
       myVideo
>static
    >video
        >myVideo

type or paste code here

this is my first question so any feedback is appreciated

[hrishikesh]

Try:

[Support Guide] Netlify app builds locally but fails on deploy (case sensitivity)

Last Reviewed By Netlify Support Staff: December 2022 Are you struggling to understand why your project runs locally but errors out with missing files or logs that point toward issues with case when you try and build on Netlify? You are not alone. Often, case (as in: UPPERCASE or lowercase letters in filenames or paths) can cause problems. Here is a guide to understanding how case sensitivity issues present themselves, why they arise, and how you can fix them! 1. Errors you might see Case sens…

[wow_studio]

thank you for the reply

I found the issue .mp4 was in my .gitignore file therefore netlify was not able to locate the video file

[SamO]

that’s awesome thanks for sharing your solution!