import error from react project during build time

Question

I'm having import problems from 2 files of my react project. I've attached the screenshot of my localhost 3000: please help me fix the problem . I've supplied code of the 2 files.

here is the index.js file code

export {
    addIngredient,
    removeIngredient,
    initIngredients
} from './burgerBuilder';
export {
    purchaseBurger, purchaseInit, fetchOrders
} from './order';

here is the burgerBuilder.js code:

// only synchronous action creators for adding n removing ingredients
import * as actionTypes from './actionTypes';
import axios from '../../axios-orders';


export const addIngredients =(name) =>{
    return{
        type: actionTypes.ADD_INGREDIENT,
        ingredientName: name
    };
}

export const removeIngredients =(name) =>{
    return{
        type: actionTypes.REMOVE_INGREDIENT,
        ingredientName: name
    };

};

export const setIngredients = (ingredients) => {
    return{
        type: actionTypes.SET_INGREDIENTS,
        ingredients:  ingredients
    };
}

export const fetchIngredientsFailed = () => {
    return{
       type: actionTypes.FETCH_INGREDIENTS_FAILED
    };
}

//init is shrt frm of initialization

export const initIngredients = () => {
    
  //return an action here
  return dispatch => {
    axios.get('https://react-my-burger-b5132.firebaseio.com/ingredients.json')
    .then(response =>{
       dispatch(setIngredients(response.data));
    })
    .catch(error =>{
       dispatch (fetchIngredientsFailed());
    });   
  };
};


     

Answer 1

Your re-export names don't match your export names from burgerBuilder.js. For example, you are exporting "addIngredients", but re-exporting a different name "addIngredient". The names must all match.