SASS and SCSS Undefined variable in production build after upgrading from v4 to v5

[nsmithdev]

Describe the bug

After upgrading from v4 to v5 I am receiving lots of error related to undefined variables errors only in production build.
No config change were made only npm package version upgrade.

Before: "vite": "^4.4.8",
After: "vite": "^5.0.0",

I can still compile with scss manually with command:
.\node_modules\.bin\sass --load-path=node_modules .\src\assets\styles\app.scss

Did something change with how scss variable scoping works etc? I can't find anything in the release notes.

I wanted to check if there was a simple solution before creating a reproduction.
I'll post it soon as I can create one.

Reproduction

a

Steps to reproduce

No response

System Info

Windows and sass 1.64.2 though I have tried updating it also.

Used Package Manager

npm

Logs

error during build:
Error: Undefined variable.

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[nsmithdev]

It seems to be treating all my scss files as individual entry points and or trying to compile them individually even if they are not referenced by any react code.
I was able to rename one of the files to a random name 99common99.scss and it's still trying to compile it.
When I create a new project i'm not seeing it behave the same way.

[nsmithdev]

Ok I tracked it down to a usage of URL() with import.meta.url which was causing it to try and compile all my scss files under assets individually.

<img className='logo' src={ getAssetUrl(`companyLogos/${ user.companyLogoName }`) } alt='altLogo'/>

export const getAssetUrl = (path) => {
  return new URL(`../assets/${ path }`, import.meta.url).href
}

Updating ../assets/${ path } to ../assets/companyLogos/${ path } made it stop compiling the unreferenced scss files.

[github-actions]

Hello @nsmithdev. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with needs reproduction will be closed if they have no activity within 3 days.