根据相同的公共本地模块打包多个Typescript项目

jes*_*ing 5 npm typescript azure-pipelines-build-task azure-devops-extensions

我正在开发一组VSTS扩展。每个扩展都是一个自己的小Node项目,它package.json具有自己的node_modules文件夹。文件夹结构如下:

 - MyExtension
   - package.json // containing all dev-dependencies
   - tslint.json
   - Tasks
     - tsconfig.json
     - Common
       - common.ts    // containing functioanlity shared across tasks
       - package.json // containing all runtime dependencies for all projects
     - My1stTask
       - package.json // containing all prod-dependencies
       - task.ts      // containing task implementation
     - ...
     - ...
     - My6thTask
       - package.json // containing all prod-dependencies
       - task.ts      // containing task implementation
Run Code Online (Sandbox Code Playgroud)

VSTS构建任务的工作方式是,它们应完全独立。到目前为止,我已经通过将Common项目的内容复制到每个任务中,然后tsc将其全部转换为JavaScript来解决此问题。

这还不错,但是需要不断复制Common的内容才能进行测试。

我尝试使用本地文件引用,并在每个任务的package.json中添加了一个依赖项,该依赖项在file:../common开发时就可以使用,但是在生成扩展名后,这不会导致公共模块成为任务的一部分。

我的背景不是Node开发,而是C#。我到处搜索,还没有找到一种适用于vsts-extensions的解决方案。

  • npm pack 似乎无法正常运行,因为扩展程序希望所有文件都在那里。
  • package.json/bundleDependencies 看起来很有希望,但是没有捆绑本地文件引用。
  • ///<reference path="../common/common.ts"/> 可以很好地进行编辑,但是在构建扩展后仍然无法运行。
  • 带有prepend的项目参考无效,构建任务需要commonjs模块解析器。系统和AMD无法加载模块。前置仅适用于后者。

有没有一种方法可以使我“无缝”完成这项工作,而不必大惊小怪,只需让每个MyXthTask在其node_modules文件夹中都有本地公共模块的副本即可?

jes*_*ing 4

我尝试了 @matt-mccutchen 的方法,但不幸的是,我无法将其与 VSTS 构建任务一起使用,因为这些任务需要commonjs

"compilerOptions": {
  "module": "commonjs",
  "target": "es6", 
Run Code Online (Sandbox Code Playgroud)

但我确实找到了适合我的解决方案。

Tasks文件夹中,我添加了一个tsconfig.json定义默认设置并包含公共库中的文件的文件夹:

{
  "compileOnSave": true,
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "sourceMap": true,
    "strict": false,
    "strictNullChecks": false,
    "removeComments": true
  },
  "files": [
    "./Common/uuidv5.d.ts",
    "./Common/Common.ts"
  ]
}
Run Code Online (Sandbox Code Playgroud)

然后在每个任务中我创建了一个tsconfig.json将输出文件夹设置为该项目的当前文件夹并继承自tsconfig.json文件夹中的Tasks

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
      "outDir": "./", 
      "sourceRoot": "./"
  },
  "files": [
      "InstallExtension.ts"
  ]
}
Run Code Online (Sandbox Code Playgroud)

这导致:

 - MyExtension
   - package.json // containing all dev-dependencies
   - tslint.json
   - Tasks
     - tsconfig.json   // Including Common by default
     - Common
       - common.ts     // containing functionality shared across tasks
       - package.json  // containing all runtime dependencies for Common
       - tsconfig.json // containing build configuration for just the common files, inherits from ..\Task\tsconfig.json
     - My1stTask
       - package.json  // containing all prod-dependencies for the task
       - task.ts       // containing task implementation
       - tsconfig.json // containing build configuration for the task, inherits from ..\Task\tsconfig.json
     - ...
     - ...
     - My6thTask
       - package.json // containing all prod-dependencies
       - task.ts      // containing task implementation
       - tsconfig.json // containing build configuration for the task, inherits from ..\Task\tsconfig.json
Run Code Online (Sandbox Code Playgroud)

编译任务时如下

     - My6thTask
       - Common
         - Common.js   // Compiled common
       - My6thTask
         - task.js     // Compiled task
       - package.json  // containing all prod-dependencies
       - task.ts       // containing task implementation
       - task.json     // defining the task UI
       - tsconfig.json // containing build configuration for the task
Run Code Online (Sandbox Code Playgroud)

我唯一需要添加的task.ts是以下内容:

///<reference path="../Common/Common.ts"/>
import * as common from "../Common/Common";
Run Code Online (Sandbox Code Playgroud)

并更改 task.json 中的执行处理程序以指向新位置:

  "execution": {
    "Node": {
      "target": "InstallExtension/InstallExtension.js", // was: InstallExtension.js
      "argumentFormat": ""
    }
  }
Run Code Online (Sandbox Code Playgroud)

一切似乎都很好:D。结合使用,glob-exec我在构建干净时能够将构建时间缩短到不到一分钟:

"initdev:npm": "npm install & glob-exec --parallel --foreach \"Tasks/*/tsconfig.json\" -- \"cd {{file.dir}} && npm install\"",
"compile:tasks": "glob-exec \"Tasks/*/tsconfig.json\" -- \"tsc -b {{files.join(' ')}}\"",
"lint:tasks": "glob-exec --parallel --foreach \"Tasks/*/tsconfig.json\" -- \"tslint -p {{file}}\"",
Run Code Online (Sandbox Code Playgroud)