2017-07-07 33 views
1

私は流星とHerokuを使ってwebappを開発しようとしています。私は私のコードを実行すると、ローカルにすべてが正常ですが、できるだけ早く私はHerokuのにデプロイとして、私は得る:Herokuはモジュールを見つけることができません

見つけることができませんモジュールの./navbar/NavBar.js'

またはIの場合私のコードでナビゲーションバーを取り除く:

モジュールを見つけることができません「./component/App」

マイプロジェクトフォルダは、次のようになります。

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

    Server 
    main.js 

そして、これは私のコードです:

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'}}/> 
    } 
    } 

} 

heroku run bashcat NavBar.jsがあり、私のファイルがthisで提案されているように英雄であったことを確認しています。コードが完全にローカルで動作して以来、奇妙なものがあります。

編集:Herokuでのビルドは成功しました。私のページをロードしようとすると、これらのエラーが表示されます。

+0

どのHerokuビルドパックを使用してMeteorプロジェクトを展開していますか? – ghybs

+0

私はこのチュートリアルに続きました:https://medium.com/@leonardykris/how-to-run-a-meteor-js-application-on-heroku-in-10-steps-7aceb12de234 私のビルドパックは:https://github.com/AdmitHub/meteor-buildpack-horse.git –

答えて

-1

あなたのプロジェクトフォルダに3つのサブフォルダ(クライアント、コンポーネント、サーバー)が含まれていると仮定しています。あなたのmain.jsファイルの使用時には:

import App from '../component/App'

あなたは、単一の使用しています ""サーバーフォルダー内のコンポーネントフォルダーを検索します。 あなたはダブル "と一緒にトラバースする必要があります。

+0

答えをupvoteすることを忘れないでください。 –

+0

問題は同じですか? @Gleyak iHope –

+0

私は2つのサブフォルダ(クライアントとサーバー)を持っています。コンポーネントはクライアントのサブフォルダです。私は失われていて、すべてが助けになるだけなので、あなたの解決策を試しましたが、それは仕事をしませんでした。私が言ったように、私のプロジェクトは完全にローカルで動作するので、私のコードは大丈夫です。それを試してくれてありがとう! :) –

0

一部の検索で、私は英雄さんにコンポーネントフォルダとコンポーネントフォルダがあることがわかりました。なぜ私の流星プロジェクトには1つだけのフォルダコンポーネントがあるのか​​わからない。 heroku run bashを使って私の問題を見つけました。

関連する問題