corejam create component / route

[mattvb91]

In the CLI package we can provide some QoL improvements when creating new components or routes. Currently when you want to create a new component or route it usually ends up with having to copy / paste an existing stencil file and renaming / removing existing code.

This can be made simpler by a command in the @corejam/cli package: corejam create component my-component or corejam create route my-route.

Both commands should then create an empty file with the correct class name & tag name. For example:

corejam create component my-component will result in the following file inside your project:

// app/components/my-component/my-component.tsx
import { Component, h } from "@stencil/core";

@Component({
  tag: "my-component",
})
export class MyComponent {

  render() {
    return (
        <corejam-box>
          my-component
        </corejam-box>
    );
  }
}

When creating a route it should take the path into consideration. For example corejam create route new/test should result in a file being created in app/routes/new/test.tsx:

import { Component, h, Host } from "@stencil/core";

@Component({
  tag: "route-new-test",
})
export class RouteNewTest {
  render() {
    return (
      <Host>
        <corejam-box>route-new-test</corejam-box>
      </Host>
    );
  }
}

A good starting point is to take a look at existing commands and go from there to add a new one: packages/cli/src/index.ts