Cách sử dụng SCSS module với ReactJS

[Michael]

Dạ như tiêu đề, làm sao để sử dụng SCSS module dạng object với file reactjs vậy các bác? Em đã search google rồi mà toàn ra sử dụng CSS module với reactjs. Em cảm ơn nhiều.

[Le_Duy_Tung (Lê Duy Tùng)]

bạn cứ tạo file scss rồi import vào và sử dụng thôi
nếu có lỗi gì thì post lên đây rồi nói chuyện tiếp

[Michael]

Dạ đây anh

SCSS module trước khi dùng BEAM => không lỗi

import styles from './App.module.scss'

const App = _ => {
  return (
    <div className={styles.parent}>
      Cha màu đỏ nè
      <div className={styles.child}>
        Con màu xanh nè
      </div>
    </div>
  )
}
export default App

---

.parent {
  color: red;
  .child {
    color: blue;
  }
}

---

src/
├─ App.jsx
├─ App.module.scss

Kết quả:

SCSS module sau khi dùng BEAM với __ và -- => bị lỗi -- trong JS

.parent--ahihi {
  color: red;
  &__child--ahihi {
    color: blue;
  }
}

---

import styles from './App.module.scss'
const App = _ => {
  return (
    <div className={styles.??????}>
      {/* className xử lý như thế nào? */}
      Cha màu đỏ nè
      <div className={styles.?????}>
        Con màu xanh nè
      </div>
    </div>
  )
}
export default App

[Milo]

Property accessors - JavaScript | MDN