wmertens / styled-vanilla-extract

A 0-runtime styled-components-like API for Qwik using vanilla-extract.
MIT License
121 stars 9 forks source link

Crash with qwik v1.6.0 : document is not defined #29

Closed franck-co closed 1 day ago

franck-co commented 1 week ago

Project fails to build with the latest qwik release v1.6.0

[vite] Error when evaluating SSR module /src/routes/demo.css.ts.vanilla.js: |- ReferenceError: document is not defined

For what i know, it happens in injectStyles function in @vanilla-extract/css/injectStyles .

var injectStyles = _ref => {
  var {
    fileScope,
    css
  } = _ref;
  var fileScopeId = fileScope.packageName ? [fileScope.packageName, fileScope.filePath].join('/') : fileScope.filePath;
  var stylesheet = stylesheets[fileScopeId];
  if (!stylesheet) {
    var styleEl = document.createElement('style');
    if (fileScope.packageName) {
      styleEl.setAttribute('data-package', fileScope.packageName);
    }
    styleEl.setAttribute('data-file', fileScope.filePath);
    styleEl.setAttribute('type', 'text/css');
    stylesheet = stylesheets[fileScopeId] = styleEl;
    document.head.appendChild(styleEl);
  }
  stylesheet.innerHTML = css;
};

I tried skipping the call when document is not defined. It does not crash but the styles are completely ignored. This is no solution.

if(typeof document !== "undefined"){
  inject(${JSON.stringify(css)});
}

You can repro with this repo : https://github.com/franck-co/styled-vanilla-extract-hot-reload On branch master (qwik 1.5.7) this is working as expected On branch 1.6.0 (qwik 1.6.0) it crashes

wmertens commented 1 week ago

This is actually a problem with Qwik 1.6.0 and should be reported there. During dev mode, right?

franck-co commented 1 week ago

That's right

wmertens commented 1 day ago

Should be fixed by https://github.com/wmertens/styled-vanilla-extract/commit/bfdccadfbdbf5310a505ada5fd89bd9da89f4e0a

brandonpittman commented 1 day ago

I can confirm things work fine with Qwik 1.7.1 and SVE 1.0.

Thanks, @wmertens. 🙇🏻