Chrome Extension: Refused to load script due to Content Security Policy (CSP) after no recent changes

I've been working on a Chrome extension using Vite and React, and everything was working fine until recently. I haven't made any changes, but now I’m getting a Content Security Policy (CSP) error preventing a script from loading.

Here is the error message I'm getting in the console:

Refused to load the script 'chrome-extension://5216f022-cd78-49fc-abf9-9e362fc1640f/assets/content-script-preamble.js.js' 
because it violates the following Content Security Policy directive: 
"script-src 'self' 'wasm-unsafe-eval' 'inline-speculation-rules' http://localhost:* http://127.0.0.1:*". 
Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

Here is my manifest.json:

{
  "manifest_version": 3,
  "name": "CRXJS React Vite Example",
  "version": "1.0.0",
  "action": { "default_title": "Tags New", "default_popup": "index.html" },
  "permissions": ["storage", "webNavigation", "tabs", "scripting", "cookies", "activeTab"],
  "background": {
    "service_worker": "src/background.js"
  },
  "content_security_policy": {
    "extension_pages": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self'"
  },
  "content_scripts": [
    {
      "js": ["src/content.jsx"],
      "matches": ["<all_urls>"],
      "run_at": "document_idle"
    }
  ],
  "host_permissions": [
    "http://localhost:3001/*",
    "https://tagdots.vercel.app/*"
  ],
  "web_accessible_resources": [
    {
      "resources": ["images/cursor-custom.png", "images/icon32.png"],
      "matches": ["<all_urls>"]
    }
  ],
  "icons": {
    "16": "images/icon32.png",
    "32": "images/icon32.png",
    "48": "images/icon64.png",
    "128": "images/icon64.png"
  }
}

The error message seems to indicate that the script chrome-extension://5216f022-cd78-49fc-abf9-9e362fc1640f/assets/content-script-preamble.js.js is being blocked due to a violation of the CSP. However, I haven’t made any changes to the manifest or the code recently.

Some additional context:

• The extension uses Vite and React.
• The error started appearing suddenly, and the extension was working fine previously.
• I am not explicitly loading any external scripts apart from the ones within the extension.
• My CSP currently allows 'self' and 'wasm-unsafe-eval' under script-src.
• I've tried to debug this but can’t seem to pinpoint what might be causing this issue.

My questions:

• What might be the cause of this error if nothing has changed in my extension?
• How can I resolve the CSP issue to allow the script to load properly?
• Any help or pointers would be greatly appreciated. Thank you!

It seems that the issue discussed below is a problem that has arisen since Chrome 130. This can be resolved by upgrading the @crxjs/vite-plugin to version ^2.0.0-beta.26.

https://github.com/crxjs/chrome-extension-tools/issues/918#issuecomment-2425242487