@storepress/create-plugin-html 0.0.5 → 0.1.0

package/plugin-templates/tools/changelog.js.mustache

@@ -0,0 +1,60 @@
+#!/usr/bin/env node
+'use strict'
+/**
+ * External dependencies
+ */
+const fs = require('fs-extra')
+const { stdout } = require('process')
+
+/**
+ * Internal dependencies
+ */
+
+const {
+	getPackageProp,
+	fromProjectRoot,
+} = require('@wordpress/scripts/utils')
+
+const version = getPackageProp('version')
+
+const changelogFile = fromProjectRoot('changelog.txt')
+
+// 2. Read and find the changelog entry for the current version.
+const changelogJs = fs.readFileSync(changelogFile, 'utf8')
+const lines = changelogJs.split('\n')
+const changelogEntry = []
+let inSection = false
+const versionString = `version ${version}`
+const dateRegex = /^\d{4}-\d{2}-\d{2}/
+
+for (const line of lines) {
+	if (inSection) {
+		if (dateRegex.test(line) && !line.includes(versionString)) {
+			break
+		}
+		changelogEntry.push(line)
+	} else if (line.includes(versionString)) {
+		inSection = true
+		// continue
+		// changelogEntry.push(line)
+	}
+}
+
+if (changelogEntry.length === 0) {
+	changelogEntry.push(`- No changelog entry for version ${version}.\n\n`)
+}
+
+// 3. Prepare the final output string
+const finalOutput = changelogEntry.join('\n').trim()
+
+// 4. Check if running in GitHub Actions environment
+/*if (process.env.GITHUB_OUTPUT) {
+	// If yes, write to the GITHUB_OUTPUT file to set an output variable
+	// The format `key<<DELIMITER` is used for multiline strings
+	fs.appendFileSync(process.env.GITHUB_OUTPUT, `changelog_body<<EOF\n${finalOutput}\nEOF\n`)
+} else {
+	stdout.write(`${finalOutput}\n`)
+}*/
+
+stdout.write(`## What's Changed\n\n`)
+stdout.write(`${finalOutput}\n`)

package/plugin-templates/tools/packages-install.js.mustache

@@ -0,0 +1,98 @@
+#!/usr/bin/env node
+/* eslint-disable no-console */
+/**
+ * External dependencies
+ */
+const fs = require('fs')
+const spawn = require('cross-spawn')
+
+/**
+ * Internal dependencies
+ */
+const {
+	getArgFromCLI,
+} = require('@wordpress/scripts/utils')
+
+/**
+ * Constants
+ */
+
+function readJSONFile (fileName) {
+	const data = fs.readFileSync(fileName, 'utf8')
+	return JSON.parse(data)
+}
+
+const EXACT_VERSION_PACKAGES = {
+	'eslint-formatter-pretty':'5.0.0',
+	'eslint-plugin-prettier':'^5.5.4',
+	'prettier':'npm:wp-prettier@3.0.3',
+}
+
+function getAllPackages ({ dependencies = {}, devDependencies = {} }) {
+	return Object.keys(dependencies).concat(Object.keys(devDependencies)).filter((packageName) => true)
+}
+
+function getPackageVersionDiff (initialPackageJSON, finalPackageJSON) {
+	const diff = ['dependencies', 'devDependencies'].reduce(
+		(result, keyPackageJSON) => {
+			return Object.keys(
+				finalPackageJSON[keyPackageJSON] || {},
+			).reduce((_result, dependency) => {
+				const initial =
+					initialPackageJSON[keyPackageJSON][dependency]
+				const final = finalPackageJSON[keyPackageJSON][dependency]
+				if (initial !== final) {
+					_result.push({ dependency, initial, final })
+				}
+				return _result
+			}, result)
+		},
+		[],
+	)
+	return diff.sort((a, b) => a.dependency.localeCompare(b.dependency))
+}
+
+function updatePackagesToLatestVersion (packages) {
+	const distTag = getArgFromCLI('--dist-tag') || 'latest'
+
+	const packagesWithLatest = packages.map(
+		(packageName) => {
+
+			const tag = EXACT_VERSION_PACKAGES[packageName] || distTag
+
+			return `${packageName}@${tag}`
+		},
+	)
+
+	return spawn.sync('npm', ['install', ...packagesWithLatest, '--save'], {
+		stdio: 'inherit',
+	})
+}
+
+function outputPackageDiffReport (packageDiff) {
+	console.log(
+		[
+			'The following package versions were changed:',
+			...packageDiff.map(({ dependency, initial, final }) => {
+				return `${dependency}: ${initial} -> ${final}`
+			}),
+		].join('\n'),
+	)
+}
+
+function updatePackageJSON () {
+	const initialPackageJSON = readJSONFile('package.json')
+	const packages = getAllPackages(initialPackageJSON)
+
+	const result = updatePackagesToLatestVersion(packages)
+
+
+	const finalPackageJSON = readJSONFile('package.json')
+	outputPackageDiffReport(
+		getPackageVersionDiff(initialPackageJSON, finalPackageJSON),
+	)
+	process.exit(result.status)
+}
+
+updatePackageJSON()
+/* eslint-enable no-console */

package/plugin-templates/tools/packages-update.js.mustache

@@ -0,0 +1,90 @@
+#!/usr/bin/env node
+/* eslint-disable no-console */
+/**
+ * External dependencies
+ */
+const fs = require('fs')
+const spawn = require('cross-spawn')
+
+/**
+ * Internal dependencies
+ */
+const {
+	getArgFromCLI,
+} = require('@wordpress/scripts/utils')
+
+/**
+ * Constants
+ */
+
+const PACKAGES_PREFIX = ['@storepress/']
+
+function readJSONFile (fileName) {
+	const data = fs.readFileSync(fileName, 'utf8')
+	return JSON.parse(data)
+}
+
+function getStorePressPackages ({ dependencies = {}, devDependencies = {} }) {
+	return Object.keys(dependencies).concat(Object.keys(devDependencies)).filter((packageName) => {
+		return PACKAGES_PREFIX.some((prefix) => packageName.startsWith(prefix))
+	})
+}
+
+function getPackageVersionDiff (initialPackageJSON, finalPackageJSON) {
+	const diff = ['dependencies', 'devDependencies'].reduce(
+		(result, keyPackageJSON) => {
+			return Object.keys(
+				finalPackageJSON[keyPackageJSON] || {},
+			).reduce((_result, dependency) => {
+				const initial =
+					initialPackageJSON[keyPackageJSON][dependency]
+				const final = finalPackageJSON[keyPackageJSON][dependency]
+				if (initial !== final) {
+					_result.push({ dependency, initial, final })
+				}
+				return _result
+			}, result)
+		},
+		[],
+	)
+	return diff.sort((a, b) => a.dependency.localeCompare(b.dependency))
+}
+
+function updatePackagesToLatestVersion (packages) {
+	const distTag = getArgFromCLI('--dist-tag') || 'latest'
+
+	const packagesWithLatest = packages.map(
+		(packageName) => `${packageName}@${distTag}`,
+	)
+
+	return spawn.sync('npm', ['install', ...packagesWithLatest, '--save'], {
+		stdio: 'inherit',
+	})
+}
+
+function outputPackageDiffReport (packageDiff) {
+	console.log(
+		[
+			'The following package versions were changed:',
+			...packageDiff.map(({ dependency, initial, final }) => {
+				return `${dependency}: ${initial} -> ${final}`
+			}),
+		].join('\n'),
+	)
+}
+
+function updatePackageJSON () {
+	const initialPackageJSON = readJSONFile('package.json')
+	const packages = getStorePressPackages(initialPackageJSON)
+
+	const result = updatePackagesToLatestVersion(packages)
+
+	const finalPackageJSON = readJSONFile('package.json')
+	outputPackageDiffReport(
+		getPackageVersionDiff(initialPackageJSON, finalPackageJSON),
+	)
+	process.exit(result.status)
+}
+
+updatePackageJSON()
+/* eslint-enable no-console */

package/plugin-templates/tools/webpack-helpers.js.mustache

@@ -2,28 +2,50 @@
 /**
  * External dependencies
  */
-const { getProjectSourcePath } = require( '@wordpress/scripts/utils/config' );
-const { fromProjectRoot } = require( '@wordpress/scripts/utils/file' );
-const { sep } = require( 'path' );
+const {getProjectSourcePath} = require('@wordpress/scripts/utils/config');
+const {fromProjectRoot}      = require('@wordpress/scripts/utils/file');
+const {sep}                  = require('path');
 
 // jquery --> window.jQuery
 // react-dom --> window.ReactDOM
 // Add `slick-carousel`, `@woocommerce/blocks-registry`,`@woocommerce/settings` on `.eslintrc.js` -> 'import/core-modules'
 const externalScriptsMap = {
-    '@storepress/utils' : ['StorePress','Utils'],
+    '@storepress/utils' : ['StorePress', 'Utils'],
 };
 
 // @babel/runtime/regenerator --> wp-polyfill
 const scriptHandleMap = {
-     '@storepress/utils' : 'storepress-utils',
+    '@storepress/utils' : 'storepress-utils',
 };
 
 const externalModulesMap = {
-	//  static import.
-	// '@wordpress/interactivity': 'module @wordpress/interactivity',
-	// dynamic import.
-	// @see: https://github.com/WordPress/gutenberg/blob/trunk/packages/block-library/src/query/view.js#L36
-	// '@wordpress/interactivity-router': 'import @wordpress/interactivity-router',
+
+    //	'module @wordpress/a11y'  →  import * as X from '@wordpress/a11y'
+    //  'import @wordpress/a11y'  →  module.exports = import('@wordpress/a11y')
+
+    '@storepress/utils' : 'module @storepress/utils',
+
+    // import('@storepress/utils').then(()=>{});
+    // OR
+    // const config = await fetch('../config.json').then(response => response.json());
+    // const driver = await import(`@storepress/utils`);
+    // driver.connect();
+
+    /*
+          ```html
+              <script type="importmap">
+                  {
+                    "imports":
+                        {
+                            "@wordpress/interactivity":"http://example.com/wp-includes/js/dist/script-modules/interactivity/index.min.js"
+                            "@storepress/utils":"./build/storepress-utils-module.js"
+                        }
+                  }
+              </script>
+
+              <link rel="modulepreload" href="http://example.com/wp-includes/js/dist/script-modules/interactivity/index.min.js" fetchpriority="low" />
+              <link rel="modulepreload" href="./build/storepress-utils-module.js" fetchpriority="low" />
+              ```*/
 };
 
 /**
@@ -37,10 +59,10 @@ const externalModulesMap = {
  * @return {string|string[]|undefined} The resulting external definition. Return `undefined`
  *   to ignore the request. Return `string|string[]` to map the request to an external.
  */
-function requestToExternal( request ) {
-	if ( externalScriptsMap[ request ] ) {
-		return externalScriptsMap[ request ];
-	}
+function requestToExternal(request) {
+    if (externalScriptsMap[request]) {
+        return externalScriptsMap[request];
+    }
 }
 
 /**
@@ -54,10 +76,10 @@ function requestToExternal( request ) {
  * @return {string|undefined} WordPress script handle to map the request to. Return `undefined`
  *   to use the same name as the module.
  */
-function requestToHandle( request ) {
-	if ( scriptHandleMap[ request ] ) {
-		return scriptHandleMap[ request ];
-	}
+function requestToHandle(request) {
+    if (scriptHandleMap[request]) {
+        return scriptHandleMap[request];
+    }
 }
 
 /**
@@ -76,35 +98,35 @@ function requestToHandle( request ) {
  *   - Return `string` to map the request to an external.
  *   - Return `Error` to emit an error.
  */
-function requestToExternalModule( request ) {
-	if ( externalModulesMap[ request ] ) {
-		return externalModulesMap[ request ];
-	}
+function requestToExternalModule(request) {
+    if (externalModulesMap[request]) {
+        return externalModulesMap[request];
+    }
 }
 
-function getFile( fileName ) {
-	return fromProjectRoot( getProjectSourcePath() + sep + fileName );
+function getFile(fileName) {
+    return fromProjectRoot(getProjectSourcePath() + sep + fileName);
 }
 
-function getRootFile( fileName ) {
-	return fromProjectRoot( fileName );
+function getRootFile(fileName) {
+    return fromProjectRoot(fileName);
 }
 
 function getWebPackAlias() {
-	return {
-		// '@utils': getFile('utils/Plugin'), // Add @utils on .eslintrc.js -> 'import/core-modules'
-		//'@storepress/icons': getFile('packages/icons'),
-		//'@storepress/utils': getFile('packages/utils'),
-		//'@storepress/components': getFile('packages/components'),
-		'@{{kebabNamespace}}/{{kebabSlug}}': getFile('index.js'),
-	};
+    return {
+        // '@utils': getFile('utils/Plugin'), // Add @utils on .eslintrc.js -> 'import/core-modules'
+        //'@storepress/icons': getFile('packages/icons'),
+        //'@storepress/utils': getFile('packages/utils'),
+        //'@storepress/components': getFile('packages/components'),
+        '@storepress/html-plugin' : getFile('storepress/index.js'),
+    };
 }
 
 module.exports = {
-	getFile,
-	getRootFile,
-	getWebPackAlias,
-	requestToExternal,
-	requestToHandle,
-	requestToExternalModule,
+    getFile,
+    getRootFile,
+    getWebPackAlias,
+    requestToExternal,
+    requestToHandle,
+    requestToExternalModule,
 };

package/plugin-templates/tools/webpack.config.externals.js.mustache

@@ -0,0 +1,131 @@
+const [
+		  defaultJSConfig,
+		  defaultModuleConfig,
+	  ]                                            = require('@wordpress/scripts/config/webpack.config');
+const {
+		  requestToExternal,
+		  requestToHandle,
+		  requestToExternalModule,
+		  getFile,
+		  getRootFile,
+		  getWebPackAlias,
+	  }                                            = require('./webpack-helpers');
+const WoocommerceDependencyExtractionWebpackPlugin = require('@woocommerce/dependency-extraction-webpack-plugin');
+const DependencyExtractionWebpackPlugin            = require('@wordpress/dependency-extraction-webpack-plugin');
+const RemoveEmptyScriptsPlugin                     = require('webpack-remove-empty-scripts');
+const webpack                                      = require('webpack');
+
+// Helper to route files to the correct directory
+
+const getOutputFilename = (pathData) => {
+
+	const condition = (pathData.chunk.name.startsWith('wp-') || pathData.chunk.name.startsWith('react-'))
+
+	return condition
+		? `externals/scripts/[name].js`
+		: '[name].js';
+};
+
+const getOutputFilenameAsModule = (pathData) => {
+
+	const condition = (pathData.chunk.name.startsWith('wp-') || pathData.chunk.name.startsWith('react-'))
+
+	return condition
+		? `externals/modules/[name].js`
+		: '[name].js';
+};
+
+const scriptConfig = {
+	...defaultJSConfig,
+	entry : {
+		'wp-element'        : {
+			import  : '@wordpress/element',
+			library : {
+				name : ['wp', 'element'],
+				type : 'window'
+			}
+		},
+		'react-jsx-runtime' : {
+			import  : 'react/jsx-runtime',
+			library : {
+				name : ['ReactJSXRuntime'],
+				type : 'window',
+			}
+		},
+	},
+
+	output : {
+		...defaultJSConfig.output,
+		filename : getOutputFilename,
+	},
+
+	resolve : {
+		...defaultJSConfig.resolve,
+		alias : {
+			...defaultJSConfig.resolve.alias,
+			...getWebPackAlias(),
+		},
+	},
+
+	plugins : [
+		...defaultJSConfig.plugins,
+		...defaultJSConfig.plugins.filter(
+			(plugin) =>
+				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+		),
+		new webpack.optimize.LimitChunkCountPlugin({maxChunks : 1}),
+	],
+};
+
+const moduleConfig = {
+	...defaultModuleConfig,
+	entry : {
+		// ...defaultModuleConfig.entry(),
+		// 'custom-module': getFile( 'custom-module.js' ),
+		/*'storepress-utils-module': {
+			import: '@storepress/utils/build-module/index.js',
+			library: {
+				type: 'module',
+			},
+		}*/
+
+		'wp-interactivity' : {
+			import  : '@wordpress/interactivity',
+			library : {
+				type : 'module'
+			}
+		},
+	},
+
+	output : {
+		...defaultModuleConfig.output,
+		filename : getOutputFilenameAsModule,
+	},
+
+	resolve : {
+		...defaultModuleConfig.resolve,
+		alias : {
+			...defaultModuleConfig.resolve.alias,
+			...getWebPackAlias(),
+		},
+	},
+
+	plugins : [
+		...defaultModuleConfig.plugins,
+
+		...defaultModuleConfig.plugins.filter(
+			(plugin) =>
+				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+		),
+
+		new webpack.optimize.LimitChunkCountPlugin({maxChunks : 1}),
+
+		// Removes the empty `.js` files generated by webpack but
+		// sets it after WP has generated its `*.asset.php` file.
+		new RemoveEmptyScriptsPlugin({
+			stage : RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,
+		}),
+	],
+};
+
+module.exports = [scriptConfig, moduleConfig];