我已经研究 webpack 几个星期了,我已经看到了很多前端设置的例子,可能只是这是后端的设置 http://jlongster.com/Backend-Apps-with-Webpack--Part-I.
我正在尝试设置一个带有节点后端(例如express、koa、hapi等)的React应用程序,其中我需要至少一个后端转译步骤(例如babel、coffeescript等),并且我我认为使用 webpack 来保持一致性会比添加另一种构建机制(例如 gulp、grunt 等)更好。
如果我可以对后端进行更改并让服务器自动重新启动(手表风格),那就太好了。
我想知道最好的方法是否是基本上拥有两个不同的项目设置以及各自的 package.json 和 webpack.config 文件。也许将后端嵌套在server
文件夹位于顶级项目文件夹中,并使用顶级 package.json 文件中的一个或多个脚本指令来控制两者。
我想我可能必须将一台服务器代理到另一台服务器以避免 CORS 问题。
寻找比我更多的 webpack 战斗测试的指导以获得一个像样的设置。
问候,
托尼.
最简单的方法是将其分为两个任务:输出到文件夹(例如“服务器”)的构建步骤,然后观察输出文件夹的更改并重新启动服务器任务。
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.观看步骤
对于手表步骤,nodemon https://github.com/remy/nodemon监视更改并重新启动。否则,您可以使用类似的方法手动将监视任务添加到 server.jsfs.watch https://nodejs.org/docs/latest/api/fs.html#fs_fs_watch_filename_options_listener or 节点监视 https://www.npmjs.com/package/node-watch.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)