Gulp inject HTML snippets into named targets

Question

we're handling low level html markup as npm modules where one could specify via comment, the name of a modules whose supporting html would be injected at that location. A module contains the html, supporting SCSS and vanilla JS. From a SCSS & JS standpoint everything is buttoned up. The moment the module is installed, the SCSS is compiled, concatenated & appended to a core CSS file and then minified. The JS treatment is very similar.

Where I'm getting very hung up on is how to treat the html snippets. Here is what I've got, which works but this isn't dynamic in any way.

gulp.task('inject-atoms', function () {
gulp.src('./index.html')
  .pipe(inject(gulp.src(['./node_modules/my-module-name/my-module-name.html']), {
    starttag: '<!-- inject:html -->',
    transform: function (filePath, file) {
      return file.contents.toString('utf8')
    }
  }))
  .pipe(gulp.dest('./'));
});

What I'd like to be able do (within the target index.html file) is specify module names whose html snippets get injected. So something like:

<!-- inject:my-module-ABC --!>
<!-- inject:my-module-XYC --!>

The only requirement being that the modules have been installed prior to trying to inject their snippets. So the gulp task would need to sweep through the index file and for each inject comment, go fetch that module's html snippet and inject it in.

Any tips on helping me move in the right direction?

Thanks!