import CSS/fonts

[DSchau]

Trying to put together a Gatsby theme for mdx-deck, and running into some issues with loading web fonts.

A few of the fonts we use are available in Google Fonts, so I could go that way, but ideally I'd be able to use the typeface- packages (basically an encapsulation of web fonts including the necessary CSS/woff/etc. files) and then the path to the local webfont to get all the fonts we need (including Futura).

However, when I attempt to configure webpack with the css-loader and style-loader to load the CSS, the build breaks presumably because it's statically rendered and window isn't available.

$ mdx-deck build deck.js --webpack webpack.config.js
[mdx-deck] building
[mdx-deck] rendering static html
webpack:///./node_modules/style-loader/lib/addStyles.js?:23
return window && document && document.all && !window.atob;
^

ReferenceError: window is not defined

Any insight here? This apparently must have worked at some point, because I see Kent C Dodds is using CSS and able to build content out--also note that checking out that project and running the build script exhibits the same issue!

For a reproduction, check out the example here

Thanks for the awesome work here, I love mdx-deck ❤️

[slamflipstrom]

I am also getting this build error with css-loader and style-loader included in my app.

[albinotonnina]

Same, has to do with html static rendering (I'm not sure what that does actually)

--no-html during build solved my problem.

[chakrihacker]

I got this error for Appear tag and --no-html solved

[with-heart]

In case anyone else runs into this issue, you can allow css require/import by installing style-loader and css-loader and then creating webpack.config.js:

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [{loader: 'style-loader'}, {loader: 'css-loader'}],
      },
    ],
  },
}

[DSchau]

@with-heart that doesn't really seem to be the case. My example repo contained exactly that set-up and the issue persists.

I just upgraded mdx-deck to the latest and still seems to be an issue.

--no-html does indeed still work though--so I'll just close this out! Wish we could get this working at some point!