Webpack配置可调式后,如何添加多个入口文件?

#1

需求描述:最近基于React、Webpack构建一个模块化的常见插件库。
感兴趣的可以参考一下,https://github.com/coocssweb/react-plug
第一次做开源,最近比较不忙,所以每天晚上都会写一些新的组件,欢迎各位大牛指点。

现在遇到的问题是,为了方便调试,在webpack.config.js中做了可调式的配置。
那么问题来了,因为在entry中已经做了可调式配置,那么如何在这个配置的基础上配置多个入口文件呢?

下面是我的webpack.config.js配置信息。

/**
 * webpack 配置文件
 * 配置独立项、入口文件、输出项信息
 */
var webpack = require('webpack');
var path = require('path');
var node_modules_dir = path.join(__dirname, 'node_modules');
var components_dir = path.join(__dirname, 'components');
var examples_dir = path.join(__dirname,'examples');

//独立项
var deps = [
  'react/dist/react.min.js',
  'jquery/dist/jquery.min.js',
  'underscore/underscore-min.js'
];

var alias=[
    'SlideDelete/SlideDelete.js'
];

//入口文件
var entrys = ['Tip/Tip.js'];

var config = {
  devtool: 'inline-source-map',
  entry: [
    'webpack-dev-server/client?http://127.0.0.1:3000',
    'webpack/hot/only-dev-server'
  ],
  output: {
    path: path.join(__dirname, 'public/dist/'),
    filename: 'Tip.js'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ],
  resolve: {
    alias: []
  },
  module: {
    noParse : [],
    loaders: [{
      test: /\.jsx?$/,
      loaders: ['react-hot', 'babel'],
      exclude: /node_modules/
    }]
  }
}

//加载 alias项
deps.forEach(function (dep) {
  var depPath = path.resolve(node_modules_dir, dep);
  config.module.noParse.push(depPath);
 });

//加载入口文件
entrys.forEach(function(entry){
  var entryPath = path.resolve(examples_dir, entry);
  config.entry.push(entryPath);
});

module.exports = config;
#2

求大神解答。这周末又加了三个插件(机调用范例)。有时候需要回过头去优化原来的插件,没有多个入口,就还得去改webpack.config.js太麻烦了。

#3

http://webpack.github.io/docs/multiple-entry-points.html

看看这个

#4

这个资料是在没有配置可hot调式的环境下 配置多个入口的。
但我的需求是,需要在已经配置可以hot调试的前提下配置多个入口。
因为配置可hot调式entry 已经添加了 webpack-dev-server等入口文件。所以我就不知道怎么做了。
//如下,已配置可hot调式的entry只能添加一个入口文件。

var config = {
  devtool: 'inline-source-map',
  entry: [
    'webpack-dev-server/client?http://127.0.0.1:3000',
    'webpack/hot/only-dev-server'
  ],
  output: {
    path: path.join(__dirname, 'public/dist/'),
    filename: 'Tip.js'
  },
#5

不知解决了没有,我也遇到了这个问题

#6

兄弟解决了吗?

#7

入口文件可以使用数组指定多个,最后打包为一个,给个链接你http://www.w2bc.com/Article/50764

#8

把entry由数组改成对象的键值对儿,如下

entry: {  
    app: ['webpack-dev-server/client?http://0.0.0.0:8080',
          'webpack/hot/only-dev-server',
          './js/app.js',
    app1:[...,/js/app1.js]
    ]
},

我参考这个链接搞的 http://jmfurlott.com/setting-up-react-hot-loader/