The WP Plugin Skeleton is designed for building WordPress plugins with Gulp 4, PostCSS and ES6. It is based on Devin Vinson’s WordPress Plugin Boilerplate. While the WordPress Plugin Boilerplate provides a great way to write organized object-oriented code, I did miss the possibility of using modern technologies such as GULP Browser Sync, Autoprefixer, nested CSS, CSS variables, Webpack, ES6 etc. Hence, I made this “plugin skeleton”. Feel free to fork it, and modify it as you like.
Getting Started
Download the plugin from GitHub and install it directly into your plugins folder on localhost (for example in WAMP this could be www/wordpress/wp-content/plugins).
Change proxy setting in gulpfile.js to match your development environment:
function browser_sync() {
browserSync.init({
proxy: 'http://localhost/' //change if necessary - for example to http://localhost/wordpress/
});
}Navigate to the plugin folder and run npm install from the command line.
Run gulp watch from the command line to start browser sync.
Start coding.
To minify CSS and JS run gulp minify from the command line.
To generate the distribution version run gulp build. The distribution version will be located in the dist folder in the root of the plugin.
