I'm looking for some direction on different tools I could use to update an existing JSX tree and insert new JSX elements / import statements via a CLI generator.

As an example, our CLI helps to build out dialog components and auto insert them into the tree so they are ready to use at the root of the project.

We have a tree that looks like this in the base of the app

<AppContainer>
  <Router routes={routeConfig} />
  <div id="dialog-holder">
    {/* LEAVE THIS IN PLACE FOR DIALOGS TO POPULATE INTO */}
  </div>
  <Snackbar />
</AppContainer>

Currently, I've used an AST walker to find this div element and insert a new line, something like this

<NewDialog />

And then add a new import statement at the top

import NewDialog from "dialogs/NewDialog"

We have a CLI working currently to do this, but we have more use cases where we would love to update files as we generate new components and other parts of our apps and working with the AST is not simple.

The CLI is built in node and currently, we are using Yeoman for the actual generator logic and functionality.

Are there any other Node tools that could be easier to work with that would allow us to do this fine file manipulation like this?