Я так не думаю. Разве вы не согласны с тем, что дизайн был проблемой презентации? В этой структуре вы можете поместить стили в их собственную папку или рядом с презентационными компонентами.
Я могу дать вам свой взгляд на структуру папок и имен.
Если вы хотите разделить логику и представление, вы можете сделать что-то вроде этого:
- src/
- components/
- SomeComponent/
- index.js <- Container/Logic
- presentation.js <- Presentation/Layout
- styles.js <- styled-component
- index.test.js <- unit tests
- _snapshots_/ <- snapshots
- AnotherComponent/
- index.js
- presentation.js
- styles.js
- index.test.js
- _snapshots_/
Тем не менее, в своем профессиональном опыте я не обнаружил никаких преимуществ от удобочитаемости или удобства сопровождения, используя этот шаблон. Фактически, новичкам в этой технологии становится сложнее понимать и работать с ними.
Я не единственный. Сам Дан Абрамов, который первоначально предлагал это, с тех пор предположил, что это не очень хорошее современное решение для состояния технологий, которые мы имеем сейчас. Его статья о презентационных и контейнерных компонентах .
Другой взгляд на этот вопрос от Брэда Фроста , где он идет по маршруту Контейнер / Презентация, но по-своему.
Пожалуйста, позвольте мне высказать это на ваше рассмотрение; Не разделяйте ваши компоненты React таким образом, если вы действительно не знаете, что вы получите от этого выгоду из-за характера того, что вы строите. Следуйте тому, что у меня есть выше, и просто не располагайте презентационные файлы, поместите все Компоненты в index.js, выделите код, в котором вы можете выиграть, и сосредоточитесь на простоте.
- src/
- components/
- SomeComponent/
- index.js <- Component
- styles.js <- styled-component
- utils.js <- component-specific helpers/utils
- index.test.js <- unit tests
- _snapshots_/ <- snapshots