Styling: Typed CSS Modules

Last updated

Why

  • polluting filesystem with extraneous *.scss.d.ts (gitignored for)
  • had to patch up weback config in node.api.js
    • solves ssg time vs client time hydration of css module classes (see backlog.md issues)
    • underlying css-loader is setup to always "extract css to file during node build process"
  • build can become flaky
    • right now typescript complains during webpack build TS2307: Cannot find module './Post.scss'.
    • but both the ssg and client app seem to be working just fine (for now)
  • also, typings-for-css-modules-loader not compatible with css-loader@2 and requires the following in package.json

Trade-offs

  • was scoping out of global css for atoms, components, ...
  • was helping prevent errors in compile time
  • faster feedback, better developer experience

Was

"resolutions": {
  "react-static/css-loader": "1.0.1"
}

Read more