Webpack config - 別のエントリファイルを追加する

Question

さて、Reactに問題があります。だから、私はNavBarコンポーネントを作成しました。そして、JSXフォームで 'home.js'に保存して、それをindex.htmlに完全にレンダリングしています。 "ログイン"コンポーネントを作成したいと思いますが、新しい 'login.js'ファイルを作成した直後に、Webpackはこのファイルを "見る"ことができず、コンパイルされませんでした。 これは、私がWebpackの設定にこの新しいファイルをコンパイルするように言わなかったためで、私はさまざまな方法で試しましたが、両方のファイルをコンパイルすることができません。 ご協力いただければ幸いです。

以下の私のWebPACK Config]を参照してください：あなたがオブジェクトとしてエントリを設定し、その後でファイル場合は、この方法で

module.exports = { 

    resolve: { 
    modulesDirectories: ['./node_modules', './resources/assets/scripts'] 
    }, 

    entry: { 
    main: './resources/js/main.js', 
    component: './resources/js/component.js' 
    // etc, etc 
    }, 

    output: { 
    path: path.join(__dirname, 'public/assets/js'), 
    filename: '[name].min.js' 
    }, 

} 

をそれを行うneed.Iすべてのファイルを渡すことができ

var path = require('path'); 
var srcPath = path.join(__dirname, 'src'); 
var buildPath = path.join(__dirname, 'dist'); 

module.exports = { 
    context: srcPath, 
    entry: path.join(srcPath, 'js', 'home.js'), 
    output: { 
     path: buildPath, 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { 
      test: /\.jsx?$/, 
      exclude: /(node_modules|bower_components)/, 
      loader: 'babel', 
      query: { 
       presets: ['react', 'es2015'] 
      } 
      } 
     ] 
    } 
}; 

Answer 1

私はあなたのコードのサンプルを持っていませんが、私はこの説明がうまくいきたいと思います。エクスポートとインポートを使用して、ファイルの依存関係を定義します。

例えば

navbar.js 

export class Navbar{ 
    // Write your component here 
} 

login.js 

var Navbar = require('./navbar'); 

export class Login{ 
    // Write your Login component here 
    // You can also use your navbar component here since it is imported 
} 

あなたのWebPACKのエントリポイントは、ログインする必要があります。インポートによってNavbarが引き込まれることが保証されます。

私はあなたにその考えを与えることを願っています。私はあなたのコードを持っていないので、私はこれを越えて助けができません

Answer 2

エントリポイントは、例えばjQueryのためにいくつかの依存関係を必要とします、あなたはこれをこのようにすることができます。