Struttura di directory standard per un progetto React (o libreria di componenti)?

Sto provando a scoprire la giusta struttura di cartelle per il mio progetto React.Struttura di directory standard per un progetto React (o libreria di componenti)?

Questa è la struttura tipica webapp che attualmente utilizzo:

app/ 
    scripts/ 
     app.jsx 
     Component.jsx 
     __tests__/ 
      Component-test.jsx 
    styles/ 
     main.scss 
     _other.scss 
    index.html 
    favicon.ico 
dist/, dev-build/ 
    (almost the same structure as /app) 
docs/ 
    Component.md 
node_modules/ 
    (all the 3rd party libraries and plugins) 
package.json 
gulpfile.js 
.eslintrc 
various other configs

trovo molto lontano dalla perfezione. Una struttura come questa aveva senso nei tempi di MVC e simili), ma non ha molto senso quando si tratta di componenti React, perché le cose relative ai componenti sono distribuite su app/scripts/Component.jsx, app/scripts/__tests__/Component-test.jsx, styles/_other.scss e docs/Component.md. Per componenti più complessi diventa anche peggio, perché hanno bisogno di mock di dati, sia per i test unitari che per la pagina dei documenti.

penso che la ristrutturazione il progetto di avere una directory per componente sarebbe già di grande aiuto:

some/path/Component/ 
    index.jsx 
    readme.md 
    mockData.json 
    test.jsx 
    style.scss

Ma io ancora non riesco a capire i dettagli. Mi piacerebbe che il mio codice fosse eseguibile con Node, webpack e/o browserify. Mi piacerebbe essere in grado di sviluppare componenti dal vivo nella guida allo stile. Mi piacerebbe essere in grado di eseguire tutti i miei test unitari contemporaneamente. La lista continua.

Esiste uno standard di settore (best practice) per strutturare progetti React? Potresti fornire un buon esempio di struttura? Sono stanco di strutturarlo da solo e quindi di vedere problemi di manutenzione, sento di poter evitare tutto ciò seguendo uno standard del settore.

Capisco che la domanda sia molto ampia ma credo che rispondervi bene sarà un grande vantaggio per la comunità.

fonte

2015-10-30 mik01aj

non c'è modo standard, preferisco l'architettura pod come hai suggerito in modo che sia tutto in un unico posto –

Dai uno sguardo a https://github.com/kriasoft/react-starter-kit o http://stackoverflow.com/a/29982852/3219121 – matagus

Create react app fornisce la seguente struttura:

. 
├── index.html 
├── node_modules 
├── package.json 
├── README.md 
└── src 
    ├── App.css 
    ├── App.js 
    ├── App.test.js 
    ├── favicon.ico 
    ├── index.css 
    ├── index.js 
    └── logo.svg

fonte

2016-09-06 11:53:27 sylvain