Disable inline stylesheets for Next.js

Jahrhause commented 1 year ago

Hi

Im trying to disable inline stylesheets that Video.js sets in Next.js 13. This is because we use CSP rules to disable this.

I have tried using the: window.VIDEOJS_NO_DYNAMIC_STYLE = true; in the Client Component in the useEffect hook.

But it still adds inline styles:

<style class="vjs-styles-defaults">
      .video-js {
        width: 300px;
        height: 150px;
      }

      .vjs-fluid:not(.vjs-audio-only-mode) {
        padding-top: 56.25%
      }
    </style>

I thinks its because the window.VIDEOJS_NO_DYNAMIC_STYLE = true is added to late in the process. Is the any way to disable inline stylesheets via the importet NPM packages?

welcome[bot] commented 1 year ago

👋 Thanks for opening your first issue here! 👋

If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

mister-ben commented 1 year ago

There's currently not a way other than ensuring that is set first.

videojs / video.js

Disable inline stylesheets for Next.js #8489