reactjs – React项目(或组件库)的标准目录结构？

这是我目前使用的典型webapp结构：

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

我发现它离完美还很远.像这样的结构在MVC和类似的框架中是有意义的,但是当涉及到React组件时它没有多大意义,因为组件相关的东西分布在app / scripts / Component.jsx,app / scripts / __tests __ / Component-test.jsx,styles / _other.scss和docs / Component.md.对于更复杂的组件,它会变得更糟,因为它们需要数据模拟,无论是单元测试还是文档页面.

我认为重组项目以使每个组件有一个目录已经有很多帮助：

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

但我仍然无法弄清楚细节.我希望我的代码可以通过Node,webpack和/或browserify运行.我希望能够在样式指南中实时开发组件.我希望能够立刻运行所有的单元测试.名单还在继续.

构建React项目是否有任何行业标准(最佳实践)？你能提供一个好的结构例子吗？我厌倦了自己构建它然后看到维护问题,我觉得我可以通过遵循行业标准来避免这一切.

我知道这个问题非常广泛,但我相信回答这个问题对社区来说将是一个巨大的好处.