Heroku cannot find any module

Question

I'm trying to develop a webapp using meteor and Heroku. When I run my code locally everything is fine, but as soon as I deploy it on Heroku, i get:

Cannot find module './navbar/NavBar.js'

or if I get rid of the NavBar in my code:

Cannot find module './component/App'

My project folder looks like:

project
  client
    main.css
    main.html
    main.js
      component
        App.js
        Games.js
        Home.js
        Workbench.js
        navbar
          NavBar.js

  Server
    main.js

And this is my code:

main.js

import React from 'react';
import { Meteor } from 'meteor/meteor';
import { render } from 'react-dom';

import App from './component/App';

Meteor.startup(() => {
  render(<App />, document.getElementById('root'));

});

App.js

import React from 'react';
import {Container} from 'reactstrap';
import {BrowserRouter as Router, Route} from 'react-router-dom';

import Workbench from './Workbench'
import NavBar from './navbar/NavBar.js'

export default class App extends React.Component {
  render(){
    return(
      <Router>
        <div>
        <NavBar/>
          <Container fluid={true}>
            <Route path='/' component={Workbench}/>
          </Container>
        </div>
      </Router>
    )
  }
}

NavBar.js

import React from 'react';
import {nav} from 'react-bootstrap';

export default class NavBar extends React.Component {

  constructor(props){
    super(props);
    this.state = {
      gameList: [{}],
      gamesVisibility: false
    }
  }
  render() {
    const {gameList, gameVisibility} = this.state;

    return (
      <div className="sidenav">
          <h2 className="sidenav-header"><a href="/">Test project</a></h2>
          <ul>
            <li onClick={() => this.setState({gameVisibility: !gameVisibility})}> <a className="SideNavTitle">Games</a> {this.renderArrow(gameVisibility)} </li>
              {this.renderCollection(gameVisibility, gameList)}
            <li className="SideNavItem"><a>Channel</a></li>
            <li className="SideNavItem"><a>About</a></li>
          </ul>
      </div>
    );
  }

  renderCollection(visibility, collection){
      if (visibility){
          return collection.map((game) => <li id = 'test' className="SideNavSubItem"><a>{game.name}</a></li>)
      }
      else{
        return;
      }
  }

  renderArrow(visibility){
    if (visibility){
      return <i className="fa fa-arrow-down" aria-hidden="true" style={{color: 'white'}}/>
    }
    else{
      return <i className="fa fa-arrow-right" aria-hidden="true" style={{color: 'white'}}/>
    }
  }

}

I used heroku run bash along with cat NavBar.js to confirm that my file was on heroku as suggested in this post. Its kind of weird since the code work perfectly locally

Edit: The build on Heroku is successful, these errors show when I try to load my page.

Which Heroku buildpack are you using to deploy your Meteor project? — ghybs, Jul 08 '17 at 10:31
I've followed this tutorial: https://medium.com/@leonardykris/how-to-run-a-meteor-js-application-on-heroku-in-10-steps-7aceb12de234 So my buildpack is: https://github.com/AdmitHub/meteor-buildpack-horse.git — Gleyak, Jul 08 '17 at 14:15

score 0 · Answer 1 · answered Jul 09 '17 at 21:59

0

With some searching, I found that on heroku, I had a Component folder and a component folder. Not sure why since there is only 1 folder component in my meteor project. Used heroku run bash to find what was my problem.

answered Jul 09 '17 at 21:59

Gleyak

474
1
3
15

mehta-rohan · Answer 2 · 2017-07-08T11:40:53.570

-1

I am assuming your project folder contains three sub folders(client,component, server). In your main.js file use:

import App from '../component/App'

you are using single "." which searches the component folder in server folder. you need to traverse back with double "."

edited Jul 08 '17 at 11:40

answered Jul 08 '17 at 07:27

mehta-rohan

1,373
1
14
19

Is the issue remains same ? @Gleyak iHope – mehta-rohan Jul 08 '17 at 11:43
I have 2 sub folders ( Client and server ) Component is a sub folder of client. I still tried your solution since I'm so lost and everything can only help but it didnt work. As I said, my project works perfectly in local so I'm pretty sure my code is alright. Thanks for trying tho! :) – Gleyak Jul 08 '17 at 14:15

Heroku cannot find any module

2 Answers2