If you’ve been working with JavaScript in the last couple years you’ve probably heard of Webpack. It’s pretty essential in today’s JavaScript workflow and has taken the spot of other build tools like Grunt and Gulp. The WordPress core team is planning to switch to Webpack, so I thought it was high-time to see how Webpack could be integrated into a plugin development workflow. In this article, we’ll go over how to build a React plugin interface using Webpack and all (well, most of) the bells and whistles. I’ve released the starter plugin on Github so you can follow along with a live example.
What is Webpack Anyway?
Ok so what the heck is Webpack anyway? In short, Webpack is an asset bundler, which means it bundles your JavaScript, CSS, images and other assets together into one file.
Wait, what?
Why would you want this? Well the purpose of Webpack really boils down to the concept of code splitting and application structure. With ES2015, you can import assets and dependencies quite easily and with Webpack and the appropriate loader, you can even import CSS/Sass/Less and images with your JavaScript.
For example, with the style and css loaders you can
Source: https://managewp.org/articles/15694/how-to-develop-a-wordpress-plugin-using-webpack-3-react-part-1
source https://williechiu40.wordpress.com/2017/07/20/how-to-develop-a-wordpress-plugin-using-webpack-3-react-part-1/
No comments:
Post a Comment