Webpack：只使用开发服务器的一些入口点答案

【问题标题】：Webpack: use just some entry points with dev serverWebpack：只使用开发服务器的一些入口点
【发布时间】：2016-11-30 10:52:46
【问题描述】：

我有相当复杂的 webpack 配置，对于开发，我只需要通过 webpack-dev-server 使用几个入口点。 Rest 将像往常一样编译到文件系统中。有什么办法可以做到这一点，或者我需要有 2 个 webpack 配置并分别运行它们。

简单例子

{
  entry: {
    // Deliver this with dev server
    app: "../index.js",
    admin: "../admin.js",

    // Deliver this with default compilation into file system
    some_css: "../static.css",
    other_css: "../other.css"
  }
}

谢谢

【问题讨论】：

标签： javascript webpack webpack-dev-server

【解决方案1】：

最好和最干净的解决方案是为Dev 和Prod 创建两个不同的配置：

- webpack.config.js
- webpack.production.config.js

在 webpack.config 中：

entry: [

    // For hot style updates
    'webpack/hot/dev-server',

    // Our application
    // whatever file you need
    mainPath
]

在你的作品中：

devtool: 'source-map',
entry: mainPath,
output: {
  path: buildPath,
  filename: 'bundle.js'
}

当然它们是像这样检查环境变量的其他方法：

var isProduction = process.env.NODE_ENV === 'production';

然后你可以在你的配置中使用它，但是，你说你的配置已经很复杂了，不要让它变得更复杂。

更新：

如果您只想拥有多个条目：

{
    entry: {
        a: "./index",
        b: "./admin",
        c: ["./c", "./d"]
    },
    output: {
        path: path.join(__dirname, "dist"),
        filename: "[name].entry.js"
    }
}

【讨论】：

这不是用于生产的。是为了发展。正如我所提到的：javascript 是通过 webpack 开发服务器加载的，而样式必须通过文件系统中的文件加载（由于架构和用例）