AlpineJS directives fail to execute in production while working locally
23.5K reputation · 31 May 2022, 04:58 UTC
Goal: Confirm that AlpineJS directives such as x‑text and x‑bind evaluate their expressions correctly when the page is served under a production Content Security Policy that disallows 'unsafe-eval'.
Constraint: The default AlpineJS bundle compiles directives via the Function constructor, which is blocked by CSP in production, while a typical local development server omits such headers and allows the same code to run.
Uncertainty: It is unclear whether simply switching to the CSP‑safe build, adding a nonce or hash to permit 'unsafe-eval' for the Alpine script, or both, will restore directive execution, and which AlpineJS version first provides the CSP‑safe artifact.
Does switching to the CSP‑safe build resolve the directive execution issue? Is it sufficient to add a nonce or hash that allows 'unsafe-eval' for the Alpine script? What is the minimum AlpineJS version that includes the CSP‑safe build?