Stencil component generator

generate.js

/*
To setup, place in scripts/generate.js and add

"st:generate": "node scripts/generate.js"

To your npm scripts.

To generate a component in src/components/ run

npm run st:generate component my-component
*/

const fs = require('fs');

const capitalize = s => s.charAt(0).toUpperCase() + s.substr(1);

const av = process.argv;

const type = av[2];
const name = av[3];

const componentClassName = name.split('-').map(p => capitalize(p)).join('');

const jsTemplate = `
import { Component } from '@stencil/core';

@Component({
  tag: '${name}',
  styleUrl: '${name}.scss'
})
export class ${componentClassName} {
  render() {
    return (<slot />);
  }
}
`

const scssTemplate = `
${name} {

}
`

const outPath = `src/components/${name}`;

try {
    fs.mkdirSync(outPath);
} catch(e) {
    console.error('Unable to create component')
    throw e;
}

try {
    fs.writeFileSync(`${outPath}/${name}.tsx`, jsTemplate.trim());
    fs.writeFileSync(`${outPath}/${name}.scss`, scssTemplate.trim());
} catch(e) {
    console.error('Unable to create source files');
    throw e;
}

Updated the script to allow a prefix to be passed in or set in the script itself. Also renamed the script to st-generate, as this seemed more appropriate. https://gist.github.com/elebetsamer/35aabac4e9e3df7e102574e4192680f1