Using the Parcel build tool with Wordpress

Question

I've been looking into build tools lately, specifically stuff that allows PostCSS, and would therefore enable to create a build process that among other things would automatically autoprefix, minify and concatenate my Wordpress site.

It seems that one of the more current tools for this purpose is Parcel, which also boasts a zero-configuration file approach and therefore has the advantage of being the easiest to get started with.

However, Parcel seems to require an index.html file as an "entry file" to get started with it, and I'm unsure how this would work with Wordpress' index.php.

Has anyone had success getting Parcel working with a local Wordpress installation, and if so, how would it be done? If not, do you use any other build tools as part of your development workflow, and why/why not?

Answer 1

Parcel is intended to be used to build apps from the ground up. That's why they recommend starting with a index.js or index.html file.

You might be able to use Parcel's packaging for a theme or plugin, but you would lose the built-in server and live reloading ("hot module replacement") among other things. There may be more that wouldn't work.

I don't think Parcel is a good fit for WordPress development. Read more.

Answer 2

Since 2018, I have been developing all my WordPress themes with parcel. It does accept javascript files as an entry points (or even multiple of entry files). In your console:

$ parcel ./path/to/your-theme-script.js

...or for development:

$ parcel watch ./path/to/your-theme-script.js

...import your styles in your main file like this:

import './scss/app.scss';

...for watching other theme files like .php or .json, you can use parcel-plugin-watch-reload.