0

I am trying to learn redux and I have a file with an action in it.

export const changeTitle = () => {
  return {
    type: 'CHANGE_PROJECT_TITLE',
  };
};

Then I am trying to import it in a component.

import changeTitle from '../actions/index.js';

This works if I use export default in the action file but then I can only have one action.

export default changeTitle;

I am trying to figure out why it will not work without the the export default. When I try without the export default I get an error that says : "Attempted import error: '../actions/index.js' does not contain a default export (imported as 'changeTitle')." I believe I have seen examples that work without the default export so they can use multiple actions.

M. Carr
  • 107
  • 1
  • 8
  • Does this answer your question? [Why and when to use default export over named exports in es6 Modules?](https://stackoverflow.com/questions/46913851/why-and-when-to-use-default-export-over-named-exports-in-es6-modules) – technophyle Feb 09 '20 at 18:01

1 Answers1

2

in your case just change

import changeTitle from '../actions/index.js';

to

import { changeTitle } from '../actions/index.js';

and you can omit index.js name in import, it's default file for import

import { changeTitle } from '../actions';

more information about export you can find on mdn

Dmitry_r
  • 36
  • 1
  • 3