Webpack：仅使用开发服务器的一些入口点

Question

我有相当复杂的 webpack 配置，为了开发，我需要通过 webpack-dev-server 使用几个入口点。其余的将像往常一样编译到文件系统中。有什么办法可以做到这一点，或者我需要有 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"
  }
}

谢谢

Answer 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"
    }
}

Webpack：仅使用开发服务器的一些入口点

Webpack: use just some entry points with dev server

javascript

webpack

webpack-dev-server