如何在Webpack构建和NodeJS服务器进程之间共享代码？

Question

我的应用程序有一个或多或少像这样的目录结构:

• src-program/- 包含前端代码,包括package.json和webpack.config.js
• src-server/- 包含后端代码,包括不同的package.json和.babelrc
• shared/foo.js - 是前端和后端都需要的JavaScript代码

所有代码都使用ES2015语法,因此使用Babel进行转换.

对于前端,使用babel-loader在Webpack构建期间完成"transpilation" .

对于后端,它由babel-register即时完成.

shared/foo.js需要package.json在前端和后端的文件中找到的其他模块.

由于NodeJS/Webpack如何解析模块,因此无法正常找到共享模块.

---

对于Webpack,我使用这种配置以一种有点hacky的方式解决了这个问题:

resolve: {
  root: __dirname,
  fallback: [
    __dirname + "/../shared",
    __dirname + "/node_modules"

  ],
  extensions: ['', '.js', '.jsx']
},

第一个fallback确保解析"共享"模块,第二个fallback确保共享模块所需的模块仍然解析到前端node_modules目录.

这允许包括共享模块,如下所示:

import * as foo from 'foo';

---

但是,我很难让后端(即NodeJS)以相同的方式解析共享模块.

我尝试使用app-module-path,它可以foo.js解决问题,但是文件要么不被Babel处理,要么其他Babel模块transform-runtime(间接需要foo.js)无法解析,因为它们位于src-server/node_modules...

我可以通过预先转换代码而不是使用来解决问题,babe-register但无论如何都感觉不对.

那么,在Webpack构建和NodeJS服务器进程之间共享代码的好方法是什么？

Answer 1

您可以将共享模块打包为 npm 包（甚至是仅驻留在文件系统上的包）吗？然后您src-program和src-server项目可以将其添加为它们的依赖项package.json，并且它将被复制到各自的node_modules文件夹中。

请参阅：如何将本地模块指定为 npm 包依赖项