Let’s take an example: the
status messages component:
The main structure to notice is the
dist folder. The files inside the
dist folder will always be compiled by Gulp. The rest of the files are in the root of the component-folder.
.scss files and
.js files will be compiled in to CSS and JS in the
dist folder with the same name.
Any images will be optimised, and SVG's are minified. The optimised files will always be inside the dist-folder.
.html.twig files don't need compiling, so those won’t appear in the
When working, you won’t need to open up the
dist folders of each component, as it’s contents are auto-generated.
Next, let’s see what binds a component together!