I keep getting this error from ESLint on my ponent.

ESLint: says Prefer Default Export (import/prefer-default-export)

Here's is how the ponent looks

export class myponent extends React.Component {

  render() {

    //stuff here

  }
}

What is it asking for? How can I fix this?

I keep getting this error from ESLint on my ponent.

ESLint: says Prefer Default Export (import/prefer-default-export)

Here's is how the ponent looks

export class myponent extends React.Component {

  render() {

    //stuff here

  }
}

What is it asking for? How can I fix this?

• javascript
• reactjs
• eslint

• developer.mozilla/en/docs/web/javascript/reference/… – azium Commented Apr 16, 2017 at 22:31
• First result on google for "eslint prefer-default-export": github./benmosher/eslint-plugin-import/blob/master/docs/… – Jordan Running Commented Apr 16, 2017 at 22:32
• I've seen that but it's different to my ponent so I don't understand what I need to change on my ponent. Also, I got the ponent format code from React website itself :o/ – user7801216 Commented Apr 16, 2017 at 22:34

1 Answer 1

you need to specify your export as default like this:

export default class myponent extends React.Component {

  render() {

    //stuff here

  }
}

(notice the added word default) and then in other files you may import your ponent with:

import myponent from './myponent.js';

assuming that the ponent is being included from within the same directory and is defined in the file myponent.js.

You can also avoid having a default export if your file contains multiple exported things with names such as:

export const foo = 'foo';
export const bar = 'bar';

or you could even leave your original file exactly as it is without the word default and import it using a batch import:

import * as myponent from './myponent.js';