Add jsx-filename-extension rule

Some projects want to require that any file that uses JSX to end in
.jsx, and others prefer to use .js. This rule can be used to enforce
this. I see this as complimentary to require-extension.

Fixes #495

Author: lencioni

README.md

@@ -103,6 +103,7 @@ The plugin has a [recommended configuration](#user-content-recommended-configura
 * [jsx-closing-bracket-location](docs/rules/jsx-closing-bracket-location.md): Validate closing bracket location in JSX (fixable)
 * [jsx-curly-spacing](docs/rules/jsx-curly-spacing.md): Enforce or disallow spaces inside of curly braces in JSX attributes (fixable)
 * [jsx-equals-spacing](docs/rules/jsx-equals-spacing.md): Enforce or disallow spaces around equal signs in JSX attributes (fixable)
+* [jsx-filename-extension](docs/rules/jsx-filename-extension.md): Restrict file extensions that may contain JSX
 * [jsx-first-prop-new-line](docs/rules/jsx-first-prop-new-line.md): Enforce position of the first prop in JSX
 * [jsx-handler-names](docs/rules/jsx-handler-names.md): Enforce event handler naming conventions in JSX
 * [jsx-indent-props](docs/rules/jsx-indent-props.md): Validate props indentation in JSX (fixable)

docs/rules/jsx-filename-extension.md

@@ -0,0 +1,35 @@
+# Restrict file extensions that may contain JSX (jsx-filename-extension)
+
+## Rule Details
+
+The following pattern is considered a warning:
+
+```jsx
+// filename: MyComponent.js
+function MyComponent() {
+  return <div />;
+}
+```
+
+The following pattern is not considered a warning:
+
+```jsx
+// filename: MyComponent.jsx
+function MyComponent() {
+  return <div />;
+}
+```
+
+## Rule Options
+
+The set of allowed extensions is configurable. By default '.jsx' is allowed. If you wanted to allow both '.jsx' and '.js', the configuration would be:
+
+```js
+"rules": {
+  "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
+}
+```
+
+## When Not To Use It
+
+If you don't care about restricting the file extensions that may contain JSX.

index.js

@@ -43,7 +43,8 @@ module.exports = {
     'no-string-refs': require('./lib/rules/no-string-refs'),
     'prefer-stateless-function': require('./lib/rules/prefer-stateless-function'),
     'require-render-return': require('./lib/rules/require-render-return'),
-    'jsx-first-prop-new-line': require('./lib/rules/jsx-first-prop-new-line')
+    'jsx-first-prop-new-line': require('./lib/rules/jsx-first-prop-new-line'),
+    'jsx-filename-extension': require('./lib/rules/jsx-filename-extension')
   },
   configs: {
     recommended: {

lib/rules/jsx-filename-extension.js

@@ -0,0 +1,68 @@
+/**
+ * @fileoverview Restrict file extensions that may contain JSX
+ * @author Joe Lencioni
+ */
+'use strict';
+
+var path = require('path');
+
+// ------------------------------------------------------------------------------
+// Constants
+// ------------------------------------------------------------------------------
+
+var DEFAULTS = {
+  extensions: ['.jsx']
+};
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = function(context) {
+
+
+  function getExtensionsConfig() {
+    return context.options[0] && context.options[0].extensions || DEFAULTS.extensions;
+  }
+
+  // --------------------------------------------------------------------------
+  // Public
+  // --------------------------------------------------------------------------
+
+  return {
+
+    JSXElement: function(node) {
+      var allowedExtensions = getExtensionsConfig();
+      var filename = context.getFilename();
+
+      var isAllowedExtension = allowedExtensions.some(function (extension) {
+        return filename.slice(-extension.length) === extension;
+      });
+
+      if (isAllowedExtension) {
+        return;
+      }
+
+      var extension = path.extname(filename);
+
+      context.report({
+        node: node,
+        message: 'JSX not allowed in files with extension \'' + extension + '\''
+      });
+    }
+  };
+
+};
+
+module.exports.schema = [{
+  type: 'object',
+  properties: {
+    extensions: {
+      type: 'array',
+      items: {
+        type: 'string'
+      }
+    }
+  },
+  additionalProperties: false
+}];

tests/lib/rules/jsx-filename-extension.js

@@ -0,0 +1,66 @@
+/**
+ * @fileoverview Restrict file extensions that may contain JSX
+ * @author Joe Lencioni
+ */
+'use strict';
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+var rule = require('../../../lib/rules/jsx-filename-extension');
+var RuleTester = require('eslint').RuleTester;
+
+var parserOptions = {
+  ecmaVersion: 6,
+  ecmaFeatures: {
+    jsx: true
+  }
+};
+
+// ------------------------------------------------------------------------------
+// Code Snippets
+// ------------------------------------------------------------------------------
+
+var withJSX = 'module.exports = function MyComponent() { return <div />; }';
+var withoutJSX = 'module.exports = {}';
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+var ruleTester = new RuleTester();
+ruleTester.run('jsx-filename-extension', rule, {
+
+  valid: [
+    {
+      filename: 'MyComponent.jsx',
+      code: withJSX,
+      parserOptions: parserOptions
+    }, {
+      filename: 'MyComponent.js',
+      options: [{extensions: ['.js', '.jsx']}],
+      code: withJSX,
+      parserOptions: parserOptions
+    }, {
+      filename: 'notAComponent.js',
+      code: withoutJSX
+    }
+  ],
+
+  invalid: [
+    {
+      filename: 'MyComponent.js',
+      code: withJSX,
+      parserOptions: parserOptions,
+      errors: [{message: 'JSX not allowed in files with extension \'.js\''}]
+    }, {
+      filename: 'MyComponent.jsx',
+      code: withJSX,
+      parserOptions: parserOptions,
+      options: [{extensions: ['.js']}],
+      errors: [{message: 'JSX not allowed in files with extension \'.jsx\''}]
+    }
+  ]
+
+});