/vite-for-php

Testing Vite for PHP development.

Primary LanguageHack

Vite for PHP development

Can Vite replace Gulp?

The dev community claims we should be moving to Vite. It's "out of the box" capabilities seem to be enough for JS developers. Making Vite work in a PHP project with multiple CSS outputs however seems to require plenty of configuration, and fighting a system that was not designed for this purpose.

Failures:

  • No full control over output filenames.
  • No separated tasks, causing a page reload when only a HMR would be sufficient.
  • No processing of empty files.
  • No linting, or error notification.
  • No sourcemaps.

Some of these can probably be overcome by adding more modules and adding further complexity to the setup. Considering the shaky core I did not feel it was worth exploring this.

My opinion may change in the future. The method-e branch came closest to my goals, if you wish to continue testing.

A related repo of mine is vite-for-wordpress.

Inputs & outputs

/less/frontend.less > /public_html/assets/less-frontend.css
/less/backend.less  > /public_html/assets/less-backend.css
/scss/frontend.scss > /public_html/assets/scss-frontend.css
/scss/backend.scss  > /public_html/assets/scss-backend.css
/js/frontend.js     > /public_html/assets/frontend.js
/js/backend.js      > /public_html/assets/backend.js

Feature testing

✔️ Run once
✔️ Run continously

❔ Run in development mode
❔ Run in production mode

✔️ Compile Less to CSS
✔️ Compile SCSS to CSS
✔️ Compile ES to JS
✔️ Autoprefix CSS
✔️ Minify CSS
✔️ Minify JS
❔ CSS sourcemaps
❔ JS sourcemaps
✔️ Multiple CSS tasks
✔️ Multiple JS tasks

✔️ Reload on CSS changes
✔️ Reload on JS changes
✔️ Reload on PHP changes

❔ Notification on CSS error
❔ Notification on JS error

✔️ Keep going on CSS error
✔️ Keep going on JS error