Process for hatching fragments

Component templates and samples are stored in /fragments

In order to build a component from fragments to the projects ui.apps folder use the percli hatch command. The hatch command uses the sample*.json files, the template.html, and htmltovue.js to build a vue component.

To build a specific component. percli hatch componentname

To build all components percli hatch *

css is located in ui.apps/src/main/content/jcr_root/etc/felibs/themecleanflex/styles.css

In order to cut down on css size we used postcss and the purge css plugin. Whenever you change or add new classes to the markup and/or css you need to run npm run build:styles from within the ui.apps directory in order to build the final css file.

The component library is created with the buildscripts in ui.apps/src/main/content/buildscripts and there is an npm script to update the library. (Any time you change any of the sample.json files you will need to update the library)

npm run build:componentlibrary

After making any changes you will need to upload the package to your local instance, run:

percli compile -d