ამ პროექტში სტილისთვის გამოვიყენებთ CSS მოდულებს. ეს გვჭირდება ლოკალური (scoped) სტილების შექმნისთვის, თავიდან რომ ავირიდოთ კლასების კონფლიქტები: რა მოხდება თუ a.css-ში სტილი მიანიჭეთ container ელემენტს, მაგრამ b.css-ში თქვენმა ჯგუფელმა იგივე კლასის სახელი გამოიყენა, მაგრამ სხვა სტილები მიანიჭა? თქვენი დაწერილი კოდი ერთმანეთთან კონფლიქტში იქნება, ის სტილი გავრცელდება, რომელიც ბოლოს ჩაიტვირთა. CSS მოდულების ამ პრობლემას აღმოფხვრის: სხვადასხვა ფაილებში იგივე კლასის სახელიც რომ გამოიყენოთ, პრობლემა არ იქნება.
CSS module-ების გამოსაყენებლად ვქმნით ფაილს MyComponent.module.css. სტილების გამოსაყენებლად React-ის კომპონენტში ვაიმპორტებთ styles ობიექტს და .-ით ვწვდებით თითოეულ სტილს:
import styles from "./MyComponent.module.css";