This my personal Gulp config for bundling static websites.
It uses Gulp, Pug, MarkdownIt, Sass and TypeScript.
Initializes development
environment enabling sourcemaps for CSS and JS, watches for changes and starts browser-sync
server.
Initializes production
environment enabling minifiers for HTML, CSS and JS and builds the project.
project
+- dist/
| +- output_is_here
+- data/
| +- file.json
| +- file.yaml
+- assets/
| +- subdir/
| +- any_assets
+- src/
+- scripts/
| +- subdirs_are_not_compiled/
| +- index.ts
+- styles/
| +- subdirs_are_not_compiled/
| +- index.scss
+- templates/
+- pages/
+- about/
| +- contacts.md
| +- index.pug
+- index.pug
Entries name of which starts with underscore (_
) are ignored.
Entry: src/templates/pages/**/*.pug
Task: templates:full
Entry: data/\*_/_.{json,y?(a)ml}
Task: data
All data is merged recursively. So you can have a dir and a file called the same name.
Adds root to specified path. Root is data.site.root
if exists and if environment is production. Otherwise root is "/"
.
Entry: src/styles/*.scss
Task: styles
Entry: src/scipts/*.ts
Task: scripts