Sitecore JSS manifesterator

generateManifest.js

// would be part of a new `sitecore-jss-manifest` module

export default (routeData, specData) => {
  // convert route data and spec data to Sitecore stuff.
  // write `sitecore-import.json` to disk
};

generateRouteData.js

// would be part of a new `sitecore-jss-manifest` module

export default () => {
  const routeData = getRouteDataFromWhereverItLivesOrHoweverYouWantThx();
  return routeData;
});

generateSpecData.js

// would be part of a new `sitecore-jss-manifest` module

export default (specFileNames = []) => {
  const specData = specFileNames.map((fileName) => {
    const spec = require(fileName).default; // dynamic file load
    return spec();
  });

  return specData;
};

manifestoTron.js

// would be part of a new `sitecore-jss-manifest` module, the 'entry point'

import generateManifest from './generateManifest';
import generateRouteData from './generateRouteData';
import generateSpecData from './generateSpecData';

const routeData = generateRouteData();

// get specFileNames from cli, params, search, whatever...
const specFileNames = '//*[@templatekey = "SPEC"]'; // Sitecore descendants FTW :)
const specData = generateSpecData(specFileNames);

generateManifest(routeData, specData);

Welcome.jsx

// React component

import React from 'react';
import PropTypes from 'prop-types';
import { Placeholder } from '@sitecore/sitecore-jss-react';

const Welcome = (props) =>
  (<div>
    Welcome to Sitecore!
    <Placeholder name="page-header" />
    <Placeholder name="page-content" />
  </div>);

Welcome.propTypes = {
  title: PropTypes.string,
  text: PropTypes.string
};

Welcome.sitecore.js

// manifest spec file

import Welcome from './Welcome';

export default (manifestConfig) => {
  const propTypes = Welcome.propTypes;
  Object.keys(propTypes).forEach(key => {
    const propTypeValue = propTypes[key];
    // do something fancy here to translate propTypes into field definitions, if you can.
  });
  
  // do more fancy stuff here to generate metadata (e.g. static analysis)
  
  return {
    componentName: 'Welcome',
    fields: [
     { name: 'title', displayName: 'Title', type: 'string', editable: true },
     { name: 'text', displayName: 'Text', type: 'richText', editable: false }
    ],
    placeholders: ['page-header', 'page-content']    
  };
};