BEMのような反応成分名

Question

私はいくつかの素晴らしい反応を得ました。 https://github.com/airbnb/javascript/tree/master/react

So ...このアイデアは、クラスの場合はBEMのようになりましたが、コンポーネント名と子に使用します。少し疲れて、コンポーネントの周りを検索しています。そのよう

.. Component__childName__childName__childName.jsx

は、しかし私はこのアイデアを持っていると知っていただきたいと思います：

は、これは悪い習慣ですか？ コンポーネント名が扱いにくくなりますか？

リンクの並び順は、ボックス内のボックス内のボックス内のすべてのファイルの名前をまとめたものです。

は限り短くもらえます言う：

Component__List.jsx 
Component__List__Item,jsx 

更新質問は：

コンポーネントごとに別々のディレクトリが有用だろうか？私はそれも無関心なプロジェクトを見ています。

例えば

：ように

|-Components 
|--ExampleComponent 
|---Component.jsx 
|---ComponentList.jsx 
|---ComponentItem.jsx 
|---ComponentItemDetail.jsx 
|---Component.scss 
|--AnotherOne 
|---AnotherOne.jsx 

そして...

Answer 1

は、私はそれが持っている場合は、その後、Component_User.jsxのようなあなたのコンポーネントに名前を付けるためにあなたが良い命名規則を求めていると、それはOKだと思いますComponent_User_Header.jsxの場合、ヘッダーにはComponent_User_Header_Label.jsxというラベルが付いています。あなたが他のsmtgを求めている場合は、あなただけの残りの部分を無視することができます:)

私はより良いアプローチは、ドメインフォルダに関連するコンポーネントを配置するだろうと思う：あなたの主成分だろうとindex.cssがあなたになるようuserディレクトリindex.jsx下などそのコンポーネントのメインCSS。次に、各サブコンポーネントに対して、同様の名前のファイルをサブディレクトリとして作成できます。

user // main directory 
    image //sub directory 
    index.jsx //component file import index.css 
    index.css //css for this component 
    header 
    index.jsx //component file import index.css 
    index.css 
    index.jsx //main component file import sub-directories index files to use those components 
    index.css