Repository: parcel-bundler/parcel
File: packages/transformers/jsonld/src/JSONLDTransformer.js (JavaScript)

Code before:
  'logo',
  'photo',
  'image',
  'thumbnail',
  'screenshot',
  'primaryImageOfPage',
  'embedUrl',
  'thumbnailUrl',
  'video',
  'contentUrl',
  'url'
];

export default new Transformer({
  async transform({ asset, config, logger, options, resolve }) {
    
    let rawCode = await asset.getCode();
    // allowing any recieved jsonld to be in json5 format
    let jsonCode = json5.parse(rawCode);
    
    let parser = new JSONLDParser(asset);
    parser.parse(jsonCode);
    
    // should these be used to tell the transformer that the output is meant to be placed back into the index.html file?
    //asset.isInline = true;
    //asset.meta.inlineType = 'string';

    asset.type = 'jsonld';
    // setting it to jsonCode since the parser updates asset paths
    asset.setCode(JSON.stringify(JSON.stringify(jsonCode)));
    return [asset];
  }
});

class JSONLDParser {
  asset;

  constructor(asset) {
    this.asset = asset;    
  }

  parse(jsonld) {
    jsonld = this.extractUrlsFrom(jsonld);
  }

  extractUrlsFrom(data) {
    if(!data) return null;
    
    if (typeof data === 'string') return this.transformString(data);

    if(Array.isArray(data)) return this.iterateThroughArray(data);

Review comment (suggestion):
so locally I made the change that @DeMoorJasper suggested [here](https://github.com/parcel-bundler/parcel/pull/4397#discussion_r399685120) . After that, the built index.html file has `<div></div>` inside the script tag where the jsonld object should be. I am unsure why its putting a div in there and not the transformed jsonld object (which really should be the original jsonld object with updated asset paths).

After doing some research in the code, I was thinking that these options might be close to what I need? I tried them out and the output remains the same. Not sure how to proceed to get it to write the jsonld object into the index.html file.

Code after:
  'logo',
  'photo',
  'image',
  'thumbnail',
  'screenshot',
  'primaryImageOfPage',
  'embedUrl',
  'thumbnailUrl',
  'video',
  'contentUrl',
  'url',
];

export default new Transformer({
  async transform({asset}) {
    let rawCode = await asset.getCode();
    // allowing any recieved jsonld to be in json5 format
    let jsonCode = json5.parse(rawCode);

    jsonCode = extractUrlsFrom(jsonCode, asset);

    // json should be injected back into the html page
    asset.type = 'jsonld';
    // setting it to jsonCode since the parser updates asset paths
    asset.setCode(JSON.stringify(jsonCode));
    return [asset];
  },
});

function extractUrlsFrom(data, asset) {
  if (!data) return null;

  if (typeof data === 'string') {
    let assetPath = asset.addURLDependency(data, {});
    return assetPath;
  }

  if (Array.isArray(data)) return iterateThroughArray(data, asset);

  return iterateThroughObject(data, asset);
}

function iterateThroughObject(jsonObject, asset) {
  Object.keys(jsonObject)
    .filter(k => SCHEMA_ATTRS.includes(k))
    .forEach(k => {
      let value = jsonObject[k];
      jsonObject[k] = extractUrlsFrom(value, asset);
    });

  return jsonObject;