📦 NEW: The wp_localize_script functionality (#206)

* 📦 NEW: wp_localize_script in template

* 📦 NEW: wp_localize_script in template

* 📦 NEW: Update globals in webpack configuration

* 👌 IMPROVE: Spacing

* 👌 IMPROVE: Global names

* 👌 IMPROVE: wp_localize_script

* 👌 IMPROVE: Spacing

Co-Authored-By: Ahmad Awais ⚡️ <me@AhmadAwais.com>

Author: 2 people

packages/cgb-scripts/config/externals.js

@@ -42,6 +42,7 @@ const externals = [
 		jquery: 'jQuery', // import $ from 'jquery' // Use the WordPress version after enqueuing it.
 		'react-dom': 'ReactDOM',
 		lodash: 'lodash', // Lodash is there in Gutenberg.
+		CGB_GLOBAL: 'CGB_GLOBAL' // Add custom dynamic data to a global var.
 	}
 );
 

packages/cgb-scripts/template/src/init.php

@@ -53,6 +53,16 @@ function <% blockNamePHPLower %>_cgb_block_assets() { // phpcs:ignore
 		null // filemtime( plugin_dir_path( __DIR__ ) . 'dist/blocks.editor.build.css' ) // Version: File modification time.
 	);
 
+	// Localise globals - plugin path and url for use in blocks.
+	wp_localize_script(
+		'<% blockNamePHPLower %>-cgb-block-js',
+		'CGB_GLOBAL', // Array containing dynamic data for a JS Global.
+		[
+			'path' => plugin_dir_path( __FILE__ ),
+			'url'  => plugin_dir_url( __FILE__ ),
+		]
+	);
+
 	/**
 	 * Register Gutenberg block on server-side.
 	 *