diff --git a/lib/rules/function-component-definition.js b/lib/rules/function-component-definition.js index f326db3c99..9fa9ac0137 100644 --- a/lib/rules/function-component-definition.js +++ b/lib/rules/function-component-definition.js @@ -217,7 +217,7 @@ module.exports = { // -------------------------------------------------------------------------- const validatePairs = []; let hasEs6OrJsx = false; - return { + const astHandlers = { FunctionDeclaration(node) { validatePairs.push([node, 'function-declaration']); }, @@ -230,13 +230,27 @@ module.exports = { VariableDeclaration(node) { hasEs6OrJsx = hasEs6OrJsx || node.kind === 'const' || node.kind === 'let'; }, - JSXElement() { - hasEs6OrJsx = true; - }, 'Program:exit'() { if (hasEs6OrJsx) fileVarType = 'const'; validatePairs.forEach((pair) => validate(pair[0], pair[1])); }, }; + // if any of the following are detected, assume es6 + [ + 'ImportDeclaration', + 'ExportNamedDeclaration', + 'ExportDefaultDeclaration', + 'ExportAllDeclaration', + 'ExportSpecifier', + 'ExportDefaultSpecifier', + 'JSXElement', + 'TSExportAssignment', + 'TSImportEqualsDeclaration', + ].forEach((es6Flag) => { + astHandlers[es6Flag] = () => { + hasEs6OrJsx = true; + }; + }); + return astHandlers; }), }; diff --git a/tests/lib/rules/function-component-definition.js b/tests/lib/rules/function-component-definition.js index 693a1ce86e..5040d03f5a 100644 --- a/tests/lib/rules/function-component-definition.js +++ b/tests/lib/rules/function-component-definition.js @@ -479,6 +479,56 @@ ruleTester.run('function-component-definition', rule, { options: [{ namedComponents: 'function-expression' }], errors: [{ messageId: 'function-expression' }], }, + { + code: ` + let Hello = (props) => { + return
; + } + `, + output: ` + let Hello = function(props) { + return
; + } + `, + options: [{ namedComponents: 'function-expression' }], + errors: [{ messageId: 'function-expression' }], + }, + { + code: ` + let Hello; + Hello = (props) => { + return
; + } + `, + output: ` + let Hello; + Hello = function(props) { + return
; + } + `, + options: [{ namedComponents: 'function-expression' }], + errors: [{ messageId: 'function-expression' }], + }, + { + code: ` + let Hello = (props) => { + return
; + } + Hello = function(props) { + return ; + } + `, + output: ` + let Hello = function(props) { + return
; + } + Hello = function(props) { + return ; + } + `, + options: [{ namedComponents: 'function-expression' }], + errors: [{ messageId: 'function-expression' }], + }, { code: ` function Hello(props) { @@ -619,6 +669,54 @@ ruleTester.run('function-component-definition', rule, { errors: [{ messageId: 'function-expression' }], features: ['types'], }, + { + code: ` + import * as React from 'react'; + function Hello(props: Test) { + return React.createElement('div'); + } + `, + output: ` + import * as React from 'react'; + const Hello = function(props: Test) { + return React.createElement('div'); + } + `, + options: [{ namedComponents: 'function-expression' }], + errors: [{ messageId: 'function-expression' }], + features: ['types'], + }, + { + code: ` + export function Hello(props: Test) { + return React.createElement('div'); + } + `, + output: ` + export const Hello = function(props: Test) { + return React.createElement('div'); + } + `, + options: [{ namedComponents: 'function-expression' }], + errors: [{ messageId: 'function-expression' }], + features: ['types'], + }, + { + code: ` + function Hello(props) { + return React.createElement('div'); + } + export default Hello; + `, + output: ` + const Hello = function(props) { + return React.createElement('div'); + } + export default Hello; + `, + options: [{ namedComponents: 'function-expression' }], + errors: [{ messageId: 'function-expression' }], + }, { code: ` var Hello = (props: Test) => {