Accepted answer

I was able to fix the problem by adding the following rule to my .eslintrc.js

'@typescript-eslint/explicit-function-return-type': [
        allowExpressions: true

It allows function expressions to not have an explicitely defined return type, which removes the missing return type error from styled components' interpolator functions as they are funcion expressions.

However, I am still not totally happy with this solution as it simply turns the error off instead of fixing it directly. If you have a better solution, please share it.


The following works:

import styled from 'styled-components';

const StyledApp = styled.div((props) => {
  return {
    background-color: props.theme.colors.secondary,

I have set up ThemeProviders in my index.tsx as described here:

Related Query

More Query from same tag