[guide] Attempt to clarify filename conventions

Fixes #817.
This commit is contained in:
Jordan Harband
2016-04-13 22:37:46 -07:00
parent eb4f7cb3a8
commit 56e6815a84

View File

@@ -2337,24 +2337,39 @@ Other Style Guides
```
<a name="naming--filename-matches-export"></a><a name="22.6"></a>
- [22.6](#naming--filename-matches-export) If your file exports a single class, your filename should be exactly the name of the class.
- [22.6](#naming--filename-matches-export) A base filename should exactly match the name of its default export.
```javascript
// file contents
// file 1 contents
class CheckBox {
// ...
}
export default CheckBox;
// file 2 contents
export default function fortyTwo() { return 42; }
// file 3 contents
export default function insideDirectory() {}
// in some other file
// bad
import CheckBox from './checkBox';
import CheckBox from './checkBox'; // PascalCase import/export, camelCase filename
import FortyTwo from './FortyTwo'; // PascalCase import/filename, camelCase export
import InsideDirectory from './InsideDirectory'; // PascalCase import/filename, camelCase export
// bad
import CheckBox from './check_box';
import CheckBox from './check_box'; // PascalCase import/export, snake_case filename
import forty_two from './forty_two'; // snake_case import/filename, camelCase export
import inside_directory from './inside_directory'; // snake_case import, camelCase export
import index from './inside_directory/index'; // requiring the index file explicitly
import insideDirectory from './insideDirectory/index'; // requiring the index file explicitly
// good
import CheckBox from './CheckBox';
import CheckBox from './CheckBox'; // PascalCase export/import/filename
import fortyTwo from './fortyTwo'; // camelCase export/import/filename
import insideDirectory from './insideDirectory'; // camelCase export/import/directory name/implicit "index"
// ^ supports both insideDirectory.js and insideDirectory/index.js
```
<a name="naming--camelCase-default-export"></a><a name="22.7"></a>
@@ -2368,7 +2383,7 @@ Other Style Guides
```
<a name="naming--PascalCase-singleton"></a><a name="22.8"></a>
- [22.8](#naming--PascalCase-singleton) Use PascalCase when you export a singleton / function library / bare object.
- [22.8](#naming--PascalCase-singleton) Use PascalCase when you export a constructor / class / singleton / function library / bare object.
```javascript
const AirbnbStyleGuide = {