2017-01-01 8 views
0

私はreactjsでプロジェクトを設定しています。重要なことは、プロジェクトをセットアップするためにnodeまたはnpmを使用していないことに注意することが重要です。つまり、私はすべてのスクリプトライブラリファイルをダウンロード後に直接使用し、プロジェクトに追加しました。しかし、「輸出は定義されていない」というエラーが出ています。「Node/npmなしで反応する」 - 取得エラー - 「未取得のReferenceError:エクスポートが定義されていません」

enter image description here

もう一つは、私は私のプロジェクトにインポートキーワードを使用できないことに注意すべき。

index.htmlを

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Learn Reactjs</title> 
     <script src="react.min.js"></script> 
     <script src="react-dom.min.js"></script> 
     <script src="browser.min.js"></script> 
    </head> 
    <body> 
     <div id="root"></div> 
     <script type="text/babel" src="DropDown.js"></script> 
     <script type="text/babel" src="index.js"></script> 
    </body> 
</html> 

index.js

'use strict'; 

var DropDown = require('DropDown'); 

var HelloMessage = React.createClass({ 
    render: function() { 
    return (
     <div> 
      <h1>Hello {this.props.message}!</h1> 
      <DropDown /> 
     </div> 
    ); 
    } 
}); 

ReactDOM.render(<HelloMessage message="World" />, document.getElementById('root')); 

DropDown.js

'use strict'; 

    var DropDown = React.createClass({ 
     render: function() { 
     return (
      <div> 
      <h1>i am DropDown</h1> 
      </div> 
     ); 
     } 
    }); 

    export default DropDown; 
+0

なぜ 'export'を使用できますが、' import'は使用できませんか? – Li357

+0

ビルドレスキューアプリケーションのために 'create-react-app' npmパッケージを使用してください – uzaif

+0

私はnode/npmを使用していないので、私のプロジェクト構造では 'import'が動作しません。私は私のプロジェクトをセットアップするためにノード/ npmを使用する場合にのみインポートが機能することを知っています。だから、私は輸出を使用し、必要があります。あなたの側から何か解決策がある場合は、インポートを使用するのに当てはまる場合、私のプロジェクト構造では間違いなく働くが、node/npmを使用していないことに注意する必要があると教えてください。 –

答えて

0

私は私のpの解決策を見つけました汚れ。

ステップ1:index.htmlと同じです。

ステップ2:

'use strict'; 


var DropDown = window.DropDown; 

var HelloMessage = React.createClass({ 
    render: function() { 
    return (
     <div> 
      <h1>Hello {this.props.message}!</h1> 
      <DropDown /> 
     </div> 
    ); 
    } 
}); 

ReactDOM.render(<HelloMessage message="World" />, document.getElementById('root')); 

ステップ3:コード以下の通りindex.jsファイル置き換える

'use strict'; 


window.DropDown = React.createClass({ 
    render: function() { 
    return (
     <div> 
     <h1>i am DropDown</h1> 
     </div> 
    ); 
    } 
}); 
を以下のコードで DropDown.jsファイルを置き換えます
関連する問題