Lightning Web Component deployment for social listening fails with missing static resource

We’re deploying a new Lightning Web Component for social media sentiment tracking to our production org. The LWC uses Chart.js for visualization, which we’ve added as a static resource. The SFDX project structure includes the component under force-app/main/default/lwc/sentimentDashboard/ with the static resource in force-app/main/default/staticresources/chartjs.resource-meta.xml.

Deployment via Change Set keeps failing with error:


Component Failure: lwc/sentimentDashboard
Problem: Static resource 'chartjs' not found
Error Code: INVALID_CROSS_REFERENCE_KEY

The static resource exists in our sandbox and the component works perfectly there. We’ve verified the resource name matches exactly in the component’s JS file. We tried including the static resource explicitly in the Change Set, but the deployment still blocks our social listening dashboard rollout. Has anyone encountered this with LWC dependencies in Change Sets?

I found your issue - this is a known Change Set limitation with LWC static resource dependencies. Change Sets validate all components simultaneously during the upload phase, before actual deployment. When the LWC is validated, it checks for static resource existence in the target org at validation time, not deployment time. Since the static resource isn’t deployed yet during validation, you get the cross-reference error.

SOLUTION - Three-step approach addressing all dependency issues:

1. Static Resource Dependency (CRITICAL): You MUST deploy the static resource separately first, then deploy the LWC. But here’s the trick - don’t use Change Sets for both. Deploy the static resource via Change Set, let it complete fully (check in Setup > Static Resources to confirm it’s there), then wait 15-30 minutes for metadata cache refresh.

2. SFDX Project Structure Fix: Verify your sfdx-project.json includes both paths:

"packageDirectories": [
  {"path": "force-app", "default": true}
]

And check your .forceignore doesn’t exclude static resources. The resource-meta.xml and the actual .js file must both be in staticresources folder.

3. Change Set Component Inclusion (Best Practice): For the LWC deployment after static resource is live, your Change Set needs these exact components:

  • Lightning Web Component: sentimentDashboard
  • LWC HTML: sentimentDashboard.html
  • LWC JS: sentimentDashboard.js
  • LWC meta.xml: sentimentDashboard.js-meta.xml
  • Any related Apex controllers if used

DO NOT re-include the static resource in the LWC Change Set.

Alternative (Recommended for Production): Switch to SFDX deployment for better dependency control:

sfdx force:source:deploy -p force-app/main/default/staticresources -u prodOrg
sfdx force:source:deploy -p force-app/main/default/lwc/sentimentDashboard -u prodOrg

This gives you explicit ordering and better error messages. The metadata cache refresh happens automatically between deploys.

Why This Happens: Change Sets were designed before LWC existed. They use an older deployment API that doesn’t understand modern LWC dependency graphs. SFDX uses Metadata API 2.0 which properly handles component dependencies and deployment sequencing. For complex LWC deployments with external libraries, SFDX is always more reliable.

If you must use Change Sets (company policy, etc.), the separate deployment approach is your only option. Deploy static resource today, deploy LWC tomorrow after cache clears. I know it’s not ideal for CI/CD, but that’s the Change Set limitation with LWC static resources.

That import statement looks fine. Here’s something to check - does your SFDX project have the static resource listed in the sfdx-project.json packageDirectories? Sometimes the metadata isn’t properly tracked if it’s not in the right package directory. Also, try deploying via SFDX CLI instead of Change Sets as a test. Run ‘sfdx force:source:deploy -p force-app/main/default/staticresources/chartjs.resource-meta.xml’ first, then deploy the LWC. If that works, it confirms the Change Set is the issue, not your component structure.

Quick question - are you using a namespace in your org? I ran into similar issues when our managed package had a namespace prefix. The static resource reference in the LWC needs to include the namespace like ‘namespace__chartjs’ instead of just ‘chartjs’. Even if you’re not using a managed package, check if your org has a default namespace configured. That would explain why it works in sandbox but fails in production if the namespaces differ.

Thanks for the suggestions. We don’t have a namespace, and the contentType is set correctly to application/javascript. I tried the sequential Change Set approach - added static resource first, waited 10 minutes, then added the LWC. Still getting the same INVALID_CROSS_REFERENCE_KEY error. The static resource shows as deployed successfully in the Change Set history, but the LWC validation fails immediately. Could this be related to how the LWC imports the resource? We’re using: import chartjs from ‘@salesforce/resourceUrl/chartjs’