# JavaScript

> ES6 JavaScript support with Babel in WordPressify.

Source: https://wordpressify.co/javascript

> For the complete documentation index, see [llms.txt](https://wordpressify.co/llms.txt).

# JavaScript

WordPressify supports ES6+ JavaScript through Babel. You can use modern syntax like arrow functions, destructuring, and modules, and Babel compiles it down for browser compatibility.

## File Location

Place your JavaScript files in:

```bash
src/assets/js/
```

WordPressify watches this directory for changes and bundles all files into a single `footer-bundle.js`, which is loaded in the footer of every page.

## How Bundling Works

The bundling is configured in `gulpfile.js`. Two bundles are produced:

- **`footer-bundle.js`** - Your code from `src/assets/js/`, transpiled with Babel.
- **`header-bundle.js`** - Third-party libraries listed in the `headerJS` array (jQuery by default), concatenated without Babel.

During development, source maps are generated so you can debug your original source in the browser's DevTools. In production builds, the output is minified.

## Formatting

A Prettier config (`.prettierrc`) ships with the project for formatting HTML, JavaScript, and CSS: 2-space indent, double quotes, and an 80 character line width.

## Configuration

To control which scripts are loaded in the header vs footer, or to change Babel settings, see the [External Libraries](/external-libraries) page and the `gulpfile.js` in your project root.