[sapphi-red]

Description

This PR is updated version of #14653 with changes that was discussed in the team meeting. In that meeting, we discussed that writing nonce placeholder in every script/style/link tag is time consuming. Given that the nonce placeholder should be same even for different HTML files, we decided to make a new option for the nonce placeholder. I made a new PR as it was easier for me than rebasing the old one.

• In dev,
  • Vite will inject nonce attribute with the value of html.cspNonce option to <script>/<style>/<link rel="stylesheet">.
  • Vite will use the nonce value of meta[property=csp-nonce] when injecting style tags that is generated by CSS imports in JS.
• In build
  • Vite will inject nonce attribute with the value of html.cspNonce option to <style>.
  • Vite will generate <script>/<link rel="stylesheet">/<link rel="modulepreload"> with nonce attribute with the value of html.cspNonce option.
  • The preload function will use the nonce value of meta[property=csp-nonce] to injecting link tags

close #9719
close #11862
superseds close #11864
superseds close #11958

Additional context

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines, especially the Pull Request Guidelines.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Update the corresponding documentation if needed.
• Ideally, include relevant tests that fail without this PR but pass with it.

[bolt-new-by-stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[schamberg97]

I will try to take a close look at this PR later. It is quite easy to mess CSP things up in a way that CSP does little for actual security, so it is preferable that CSP is not messed up in vite

[sapphi-red]

/ecosystem-ci run

[vite-ecosystem-ci]

📝 Ran ecosystem CI on c11ab0f: Open

suite	result	latest scheduled
nx	❌ failure	❌ failure
vite-plugin-vue	✅ success	❌ failure

✅ analogjs, astro, histoire, ladle, laravel, marko, nuxt, previewjs, qwik, rakkas, sveltekit, unocss, vike, vite-plugin-pwa, vite-plugin-react, vite-plugin-react-pages, vite-plugin-react-swc, vite-plugin-svelte, vite-setup-catalogue, vitepress, vitest

[bluwy]

Awesome! The implementation looks great to me. I guess my only nit is about patak's comment.