How to set up multiple conversion targets

[phun-ky]

Currently, I have to do this for each target:

theo
  .convert({
    transform: {
      type: 'web',
      file: './src/dt/primary.yml'
    },
    format: {
      type: 'styl'
    }
  })
  .then(styl => {
    fs.writeFileSync('./src/primary--.styl', styl);
  })
  .catch(error => console.log(`Something went wrong: ${error}`));

How can I chain them for multiple targets (less + scss + styl+++)?

I could do this though, but I wonder if theo has support for something, better? :

['scss', 'styl', 'less'].forEach((target) => {...}

[petekp]

@phun-ky This is how I'm currently handling multiple targets in a node build script. Not too dissimilar to your forEach example.

One difference is that I‘ve created a configuration object (theoConfig) with an output field specifying the transforms/formats I'm using, and looping over that.

It might be useful to others if Theo natively supported a similar sort of configuration object for specifying multiple formats/transforms.

const theoConfig = {
  entry: 'index.yml',
  setup: THEO_SETUP_PATH,
  dest: DIST_PATH,
  output: {
    reactnative: ['js', 'd.ts'],
    web: ['cssmodules.css'],
  },
}

async function execTheo(
  entry: string,
  setup: string,
  dest: string,
  transform: Transform,
  format: Format
) {
  const { stdout, stderr } = await promiseExec(
    `${THEO_PATH} ${entry} --setup ${setup} --dest ${dest} --transform ${transform} --format ${format}`
  )

  if (stdout) {
    log.log(stdout)
  }

  if (stderr) {
    log.error(stderr)
  }
}

async function transpileTokens() {
  const { entry, dest, output, setup } = theoConfig

  await Promise.all(
    flatten(
      Object.entries(output).map(([transform, formats]) =>
        formats.map(format =>
          execTheo(entry, setup, dest, transform, format)
        )
      )
    )
  )
}