Recently, I had to setup a new create-react-app project with TypeScript and opted to go with a CSS in JS solution that allows css styles to be defined in .ts files. The library that my team decided to use is called Emotion.

In this post, I’ll explain the process that was used to setup and add styles into the app using Emotion. I’ll also cover specifics relating to TypeScript integration and how theming and global styles can be handled.

Summary

  • Setup
  • Using the CSS prop with TypeScript
  • Theming
  • Global Styles
  • Conclusion

Setup

To install into the project:

Elliot Laws

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store