ReactJS Require Is Not Working

I am new in reactJS and i can not find why react can not load authorApi using this statement

var AuthorApi = require(‘../../api/authorApi’);

Here is A snips from my project

src/components/authors/author.js code

'use strict';

var React = require('react');
var AuthorApi = require('../api/authorApi');

var Authors = React.createClass({
  getInitialState: function () {
    return {
      authors: []

  componentWillMount: function () {
    this.setState({ authors: AuthorApi.getAllAuthors() });

  render: function () {
    var createAuthorRow = function (author) {
      return (
        <tr key={}>
            <a href={"/#authors/" +}>{}</a>
            {author.firstName} {author.lastName}

    return (
                <table className="table">
                        {, this)}

module.exports = Authors;

src/api/authorApi.js code

"use strict";

//This file is mocking a web API by hitting hard coded data.
var authors = require('./authorData').authors;
var _ = require('lodash');

//This would be performed on the server in a real app. Just stubbing in.
var _generateId = function(author) {
    return author.firstName.toLowerCase() + '-' + author.lastName.toLowerCase();

var _clone = function(item) {
    return JSON.parse(JSON.stringify(item)); //return cloned copy so that the item is passed by value instead of by reference

var AuthorApi = {
    getAllAuthors: function() {
        return _clone(authors);

    getAuthorById: function(id) {
        var author = _.find(authors, {id: id});
        return _clone(author);

    saveAuthor: function(author) {
        //pretend an ajax call to web api is made here
        console.log('Pretend this just saved the author to the DB via AJAX call...');

        if ( {
            var existingAuthorIndex = _.indexOf(authors, _.find(authors, {id:}));
            authors.splice(existingAuthorIndex, 1, author);
        } else {
            //Just simulating creation here.
            //The server would generate ids for new authors in a real app.
            //Cloning so copy returned is passed by value rather than by reference.
   = _generateId(author);

        return _clone(author);

    deleteAuthor: function(id) {
        console.log('Pretend this just deleted the author from the DB via an AJAX call...');
        _.remove(authors, { id: id});

and here is src/api/authorData.js code

module.exports = {
        id: 'cory-house',
        firstName: 'Cory',
        lastName: 'House'
        id: 'scott-allen',
        firstName: 'Scott',
        lastName: 'Allen'
        id: 'dan-wahlin',
        firstName: 'Dan',
        lastName: 'Wahlin'


Error in chrome is :- Uncaught TypeError: AuthorApi.getAllAuthors is not a function


You are not exporting your AuthorApi function. Try adding:

module.exports = AuthorApi at the end of authorApi.js file.

Leave a Reply

Your email address will not be published. Required fields are marked *