Lex unicornware

Sign git commits with GPG in GitHub Actions

Generate a GPG key (see here)

gpg --full-generate-key

Save the GPG passphrase to secrets as GPG_KEY_PASSPHRASE

Pure ESM package

The package that linked you here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

Use ESM yourself. (preferred)
Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
Stay on the existing version of the package until you can move to ESM.

Verified commits made easy with GitHub Actions

So you want to commit changes generated by a GitHub Actions workflow back to your repo, and have that commit signed automatically?

Here's one way this is possible, using the REST API, the auto-generated GITHUB_TOKEN, and the GitHub CLI, gh, which is pre-installed on GitHub's hosted Actions runners.

You don't have to configure the git client, just add a step like the one below... Be sure to edit FILE_TO_COMMIT and DESTINATION_BRANCH to suit your needs.

Storybook Controls w/ CRA & TypeScript

This is a quick-and-dirty walkthrough to set up a fresh project with Storybook Controls. It's also an introduction to Storybook Args, which is a major update to Storybook's Component Story Format (CSF): a more portable and ergonomic way to write stories.

This walkthrough gives you:

Auto-generated controls in the addons panel
Auto-generated controls in your Docs
Auto-generated actions for event logging
An introduction to the future of CSF

	# Syntactic Grammar for ECMAScript

	ecma-script-module ::= { top-level \| ignorable }

	top-level ::= statement
	\| function-declaration
	\| class-declaration

	function-declaration ::= [ "async" ] "function" identifier function-params-postfix compound-statement

	# Add To Project
	#
	# Add new issues and pull requests to the project board.
	#
	# References:
	#
	# - https://docs.github.com/actions/learn-github-actions/contexts
	# - https://docs.github.com/actions/learn-github-actions/expressions
	# - https://docs.github.com/actions/using-workflows/events-that-trigger-workflows#issues
	# - https://docs.github.com/actions/using-workflows/events-that-trigger-workflows#pull_request

	const childProcess = require("child_process");

	// https://vercel.com/support/articles/how-do-i-use-the-ignored-build-step-field-on-vercel
	const ABORT_BUILD_CODE = 0;
	const CONTINUE_BUILD_CODE = 1;

	const continueBuild = () => process.exit(CONTINUE_BUILD_CODE);
	const abortBuild = () => process.exit(ABORT_BUILD_CODE);

	const app = process.argv[2] \|\| path.basename(path.resolve());

	/** Internet Explorer */
	@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	div {
	display: block;
	}
	}

	/** Microsoft Edge */
	@supports (-ms-ime-align: auto) {
	div {

	const mocks = Object.create(null);
	global.mock = function (_mocks) {
	Object.assign(mocks, _mocks);
	};

	export async function resolve (specifier, context, parentResolve) {
	if (mocks[specifier]) {
	return { url: 'mock:' + specifier };
	}
	return parentResolve(specifier, context);

	{
	"extends": "@flex-development"
	}