複数のエントリと出力を使用するReact用Webpackを設定する

Question

複数のエントリと出力を持つようにサーバを設定しようとしています。アプリはZurb Foundation、jquery、Reactを使用しています。

私はjQueryと土台がbundle.jsの一部にも反応し

のWebPACKには、サーバーの起動を検証しますが、何もショーではありませんし、コンソールに表示されるため、別のバンドル持っていないとします「にReferenceErrorを：webpackJsonpですが定義されていません "

複数のエントリを使用しようとすると、1つのエントリが機能していますが、わかりません。

webpack.config

var webpack = require('webpack'); 
var path = require('path'); 
var CommonsChunkPlugin = require('./node_modules/webpack/lib/optimize/CommonsChunkPlugin'); 

module.exports = { 
    entry: { 
     main: ['script!jquery/dist/jquery.min.js', 
     'script!foundation-sites/dist/foundation.min.js', 
     './dist/app.js' ], 
     react: ['react', 'react-dom'] 
    }, 
    externals: { 
     jquery: 'jQuery' 
    }, 
    plugins: [ 
     new webpack.ProvidePlugin({ 
      '$': 'jquery', 
      'jQuery': 'jquery' 
     }), 
     new CommonsChunkPlugin('react', 'react.bundle.js') 
    ], 
    output: { 
     filename: bundle.js' 
     }, 

    devServer: { 

     inline: true, 
     contentBase: './build', 
     port: 3000 
    }, 

    module: { 
     loaders: [ 
      { 
      loader: 'babel-loader', 
      query: { 
       presets: ['react', 'es2015'] 
      }, 
      test: /\.js?$/, 
      exclude: /(node_modules)/ 
      } 
     ] 
    } 
}; 

package.json

{ 
    "name": "boilerplate", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "build": "webpack", 
    "start": "webpack-dev-server", 
    "test": "karma start" 
    }, 
    "author": "CBM", 
    "license": "MIT", 
    "dependencies": { 
    "react": "^15.3.2", 
    "react-dom": "^15.3.2" 
    }, 
    "devDependencies": { 
    "babel-core": "^6.16.0", 
    "babel-loader": "^6.2.5", 
    "babel-preset-es2015": "^6.16.0", 
    "babel-preset-react": "^6.16.0", 
    "css-loader": "^0.25.0", 
    "foundation-sites": "^6.2.3", 
    "jquery": "^3.1.1", 
    "karma": "^1.3.0", 
    "karma-firefox-launcher": "^1.0.0", 
    "karma-mocha": "^1.2.0", 
    "karma-mocha-reporter": "^2.2.0", 
    "karma-sourcemap-loader": "^0.3.7", 
    "karma-webpack": "^1.8.0", 
    "mocha": "^3.1.0", 
    "react-router": "^2.8.1", 
    "script-loader": "^0.7.0", 
    "style-loader": "^0.13.1", 
    "webpack": "^1.13.2", 
    "webpack-dev-server": "^1.16.1" 
    } 
} 

babel.rc

{ 
    "presets": ["es2015", "react"] 
} 

Answer 1

出力を指定

jqueryライブラリとfoundationライブラリを直接HTMLに追加する場合は、エントリを追加しないでください。 フォント：https://webpack.github.io/docs/multiple-entry-points.html