将 webpack 应用于全栈节点应用程序的最合理方式是什么？

Question

我已经研究了 webpack 几个星期了，我已经看过很多前端设置的例子，而且可能只是 this one setup for a backend。

我正在尝试设置一个带有节点后端（例如 express、koa、hapi 等）的 React 应用程序，其中我至少需要一个后端转译步骤（例如 babel、coffeescript、等），我认为在那里使用 webpack 来保持一致性与添加另一个构建机制（例如 gulp、grunt 等）相比会更好。

如果我可以对后端进行更改并让服务器自动重启（手表样式），那就太好了。

我想知道最好的方法是否基本上是有两个不同的项目设置，它们有自己的 package.json 和 webpack.config 文件。也许将后端嵌套在顶级项目文件夹的 server 文件夹下，并在顶级 package.json 文件中使用一个或多个脚本指令来控制两者。

我想我可能必须将一台服务器代理到另一台服务器以避免 CORS 问题。

从那些比我测试得更多的 webpack 战斗中寻找任何指导，以获得体面的设置。

此致，托尼.

Answer 1

最简单的方法是将其分成两个任务：输出到文件夹的构建步骤（例如 'server'），然后观察输出文件夹的变化并重新启动服务器任务。

1。构建任务

这可以与客户端构建代码相同 webpack.config - 您可以导出一个数组，webpack 将监视所有这些。示例 webpack.config.js（上半部分用于服务器）

module.exports = [
{
  name: 'server code, output to ./server',
  entry: './index.js',
  output: {
    filename: './server/index.js'
  },
  target: 'node'
},
{
  name: 'client side, output to ./public',
  entry: './app.js',
  output: {
    filename: './public/app.js'
  }
}
];

2.Watch 步骤

对于观看步骤，nodemon monitor changes and restart. Otherwise you could add a watch task to your server.js manually using something like fs.watch or node-watch。

将 webpack 应用于全栈节点应用程序的最合理方式是什么？

what is the most reasonable way apply webpack to a full-stack node app?

express

webpack

webpack-dev-server

1。构建任务

2.Watch 步骤