1

我正在开发一个作为 monorepo 托管的项目。为简化起见,假设里面有三个不言自明的包:serverwebapp客户端和library. 目录结构将类似于以下内容:

the-project 
  packages
    server
      src
    webapp
      src
    library
      src

所有的包都采用流类型表示法,使用一些>ES5 特性,因此,要经过 babel 转译。主要区别在于webapp包的转译是通过 webpack 完成的,而server使用 gulp 任务触发通过gulp-babel包的脚本转译。library构建时会自动转译web

现在,我遇到的问题是,对于server构建,babel 需要library首先构建,并且package.json需要指定它的(构建的)主 JS 源文件,以便可以包含其转译的工件。可以想象,如果项目包含多个正在积极开发的库(确实如此),这将很快成为问题,因为所有库都需要构建,包括任何依赖包(就像server在这个简单的案例中一样)。

作为克服这种烦恼的尝试,我最初考虑使用 webpack 来构建服务器,这将负责将所需的任何依赖项包含在一个包中,但我遇到了问题,因为显然 webpack 不打算在节点 JS 上使用应用程序。

有哪些策略可用于构建需要 Babel 转译的节点 JS 应用程序,以便应用程序的源文件以及任何依赖项透明地构建并包含在单个输出目录中?


附件 A

用于脚本转换的简化 gulp 任务,由server.

return gulp
  .src([`src/**/*.js`], { allowEmpty: true })
  .pipe(babel({ sourceMap: true }))
  .pipe(gulp.dest('dist'));

从上面可以看出,server任务中只包含了自己的源文件。如果src要更改为也包含,则该任务将在自己的输出目录library中发出依赖项的工件,并且其中的任何语句都将尝试在而不是中定位构建的工件,从而导致导入失败。serverrequire('library')packages/librarypackages/server/dist

4

1 回答 1

0

首先,我不确定您的服务器在做什么。如果它正在进行数据库连接或一些计算,那么我不建议它由webpack. 而如果您的服务器只是进行服务器端渲染并对其他服务器进行一些 API 调用,那么我建议使用webpack.

很多项目都遵循这一理念。例如,你可以看看类似的东西,我在我的一个个人项目[Blubus]中做过。具体来说,您可能对webpack-server-config感兴趣。你也可以看看像频谱这样的大型项目是如何做到的。

于 2018-09-27T15:18:46.870 回答