Development Dependencies

Tailbreeze uses a number of open source projects to work properly. Below is a list of the main dependencies and their purpose in the project.

Parcel

Tailbreeze uses Parcel as its bundler. Parcel is responsible for bundling all the required files and dependencies of the project into a single, optimized file that can be served to the browser.

ParcelJS is different from other bundlers like webpack because it does not require any configuration or setup to get started. It uses a zero-config approach where it automatically detects and bundles the required files for a project based on the file types and dependencies in the project.

Following Parcel scripts are configured in package.json:

"scripts": {
	"start": "parcel src/pages/*.html",
	"build": "parcel build src/pages/*.html --no-source-maps"
},
  • The start script is used for development and the build script is used for production.
  • The .parcelrc file can be found at the root of the project and it contains the configuration for ParcelJS.

PostCSS

Tailbreeze uses PostCSS to configure Taiwind CSS and to add additional features to the CSS. PostCSS is configured using the .postcssrc which you can find at the project root.

PostHTML

Tailbreeze utilizes PostHTML to process HTML files, particularly when serving partial HTML files using posthtml-include plugin. PostHTML is a powerful tool that allows developers to transform HTML code using JavaScript plugins. PostHTML is configured using the .posthtmlrc which you can find at the project root.

Example usage:

<include src="./partials/_sidebar.html"></include>

Prettier

Tailbreeze uses Prettier to format the code. To make any changes to Prettier’s configuration, the .prettierrc file can be located at the root of the project.