File structure


Folder/file nameDescription
distGenerated production files, like HTML, css, js, images and vendor files.
node_modulesDirectory where npm installs dependencies.
srcThis folder holds all template source files that are then processed (compiled/minified) to dist folder.
src/imagesImage assets folder. Organised into subfolders for ease of use.
src/jsThis folder contains the main theme.js file that is processed (compiled/minified) to dist/js/theme.min.js.
src/scssThis folder contains all project sass files that are compiled and minified to styles in dist/css/ folder.
src/templatesThis folder contains all nunjuck files that are compiled into HTML in dist folder.
dist/docsThis folder contains the documentation files. Also available online.
webpack.mix.jsAll the build commands for Webpack.
gulpfile.jsAll the build commands for Gulp.
package.jsonList of dependencies and npm information.
babel.config.jsonThis file tells the Babel how we want our code to transpile.
paths.jsonInformation for Webpack and Gulp config files in json format.
data.jsonHelper data (like menu) in json format.
.browserlistrcThe config file to set up target browsers for Gulp and Webpack.
.gitignoreHides all unnecessary files from Git.
Note: If you do not use Front-End setup with Node.js and Webpack or Gulp and want to directly edit html/scss/js files, look in the dist folder