Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: how to create a GitHub Action #1196

Merged
merged 35 commits into from
Jan 28, 2024
Merged
Show file tree
Hide file tree
Changes from 28 commits
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
2655997
docs: how to create a GitHub Action
johnnyreilly Jan 6, 2024
292f85d
chore: add precommit
johnnyreilly Jan 6, 2024
a1af929
chore: formatting
johnnyreilly Jan 6, 2024
a96fa70
chore: markdown
johnnyreilly Jan 6, 2024
5997af6
chore: markdown
johnnyreilly Jan 6, 2024
294ccb4
chore: snapshot
johnnyreilly Jan 6, 2024
e2bf8a1
Merge branch 'main' of https://github.com/JoshuaKGoldberg/create-type…
johnnyreilly Jan 6, 2024
92e0c1e
Update docs/FAQs.md
johnnyreilly Jan 6, 2024
fbf7506
Update docs/FAQs.md
johnnyreilly Jan 6, 2024
d4131c9
Update docs/FAQs.md
johnnyreilly Jan 6, 2024
5fad64c
Update docs/FAQs.md
johnnyreilly Jan 6, 2024
1348dd8
Update docs/FAQs.md
johnnyreilly Jan 6, 2024
074cebe
Update docs/FAQs.md
johnnyreilly Jan 6, 2024
cd5b380
Update docs/FAQs.md
johnnyreilly Jan 7, 2024
cd9c50d
Update docs/FAQs.md
johnnyreilly Jan 7, 2024
c904bd8
fix: order
johnnyreilly Jan 7, 2024
81e51b2
fix: order
johnnyreilly Jan 7, 2024
a57325c
Merge branch 'main' into docs-github-action
johnnyreilly Jan 7, 2024
c32deaf
feat: fold into build
johnnyreilly Jan 7, 2024
5a5c515
Merge branch 'main' into docs-github-action
johnnyreilly Jan 16, 2024
0b54452
fix: path
johnnyreilly Jan 16, 2024
4307645
Merge branch 'main' into docs-github-action
johnnyreilly Jan 16, 2024
776153f
Merge branch 'main' into docs-github-action
johnnyreilly Jan 16, 2024
749e38c
Merge branch 'main' into docs-github-action
johnnyreilly Jan 16, 2024
b47e286
fix: remove tabs / spaces
johnnyreilly Jan 16, 2024
1dbdbbc
fix: lint
johnnyreilly Jan 16, 2024
eddc441
fix: lint
johnnyreilly Jan 16, 2024
ee50e37
Update docs/FAQs.md
johnnyreilly Jan 16, 2024
655d93a
Update docs/FAQs.md
johnnyreilly Jan 24, 2024
1459ac1
Update docs/FAQs.md
johnnyreilly Jan 24, 2024
ce65189
Update docs/FAQs.md
johnnyreilly Jan 24, 2024
4a86f79
Update docs/FAQs.md
johnnyreilly Jan 24, 2024
ab1322b
Update docs/FAQs.md
johnnyreilly Jan 28, 2024
4b6095e
fix: prettier
johnnyreilly Jan 28, 2024
6cc5b52
Update docs/FAQs.md
JoshuaKGoldberg Jan 28, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions cspell.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
"npmpackagejsonlintrc",
"outro",
"packagejson",
"precommit",
"quickstart",
"tada",
"tsup",
Expand Down
103 changes: 103 additions & 0 deletions docs/FAQs.md
johnnyreilly marked this conversation as resolved.
Show resolved Hide resolved
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,109 @@ After you set up a repository, you can substitute in any tools you'd like.

If you think the tool would be broadly useful to most consumers of this template, feel free to [file a feature request](https://github.com/JoshuaKGoldberg/create-typescript-app/issues/new?assignees=&labels=type%3A+feature&projects=&template=03-feature.yml&title=%F0%9F%9A%80+Feature%3A+%3Cshort+description+of+the+feature%3E) to add it in.

## How can I create a GitHub action?

Yes! If you want to read the [GitHub Actions documentation](https://docs.github.com/en/actions/creating-actions) in detail.
johnnyreilly marked this conversation as resolved.
Show resolved Hide resolved
Here we'll outline the steps required to migrate a CTA app to a GitHub Action:

1. GitHub Actions store built output on a GitHub branch rather than in a published package on npm.
As a consequence we should:

- delete `.github/workflows/release.yml` and `.github/workflows/post-release.yml`.
- update `.github/workflows/build.yml` to ensure `dist` is up to date:

<details>
<summary><code>.github/workflows/build.yml</code></summary>

```yml
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: ./.github/actions/prepare
- run: pnpm build

- name: Compare dist/index.js
run: |
if [ "$(git diff --ignore-space-at-eol --text dist/index.js | wc -l)" -gt "0" ]; then
echo "Detected uncommitted changes after build."
echo "You may need to run 'pnpm run build' locally and commit the changes."
echo ""
echo "See diff below:"
echo ""
git diff --ignore-space-at-eol --text dist/index.js
echo ""
# say this again in case the diff is long
echo "You may need to run 'pnpm run build' locally and commit the changes."
echo ""
exit 1
fi

- id: upload
if: ${{ failure() && steps.diff.outcome == 'failure' }}
name: Upload artifact
uses: actions/upload-artifact@v4
with:
name: dist
path: dist/
johnnyreilly marked this conversation as resolved.
Show resolved Hide resolved

name: Build

on:
pull_request: ~
push:
branches:
- main

permissions:
contents: read
```

</details>

- GitHub Actions run without installing package dependencies.
Replace `tsup` with [`ncc`](https://github.com/vercel/ncc) to build source files and dependencies into a single JS file.
Delete `tsup.config.ts` then execute the following commands:

```bash
pnpm remove tsup
pnpm add @vercel/ncc -D
pnpm add @actions/core -P
johnnyreilly marked this conversation as resolved.
Show resolved Hide resolved
```

- We also added the [`@actions/core`](https://github.com/actions/toolkit/tree/master/packages/core) package, used for building GitHub Actions.
Now we need to update the `build` script in our `package.json`:
johnnyreilly marked this conversation as resolved.
Show resolved Hide resolved

```diff
-"build": "tsup",
+"build": "ncc build src/index.ts -o dist --license licenses.txt",
```

- Our build now emits to the `dist` directory; so we'll want to avoid linting that directory by adding the following to `.eslintignore` and our `.prettierignore`:

```diff
+dist
```

- Rather than having to remember to compile each time, we'll update our precommit hook in `.husky/precommit` to build for us on each commit:

```diff
+pnpm run build
+git add dist
npx lint-staged
```

2. We're going to need an [`action.yml`](https://docs.github.com/en/actions/creating-actions/metadata-syntax-for-github-actions) file - [here's an example](https://docs.github.com/en/actions/creating-actions/creating-a-javascript-action#creating-an-action-metadata-file).
johnnyreilly marked this conversation as resolved.
Show resolved Hide resolved
3. Our GitHub Action needs Node.js 20 so we'll update `.github/actions/prepare/action.yml`:

```diff
-node-version: "18"
+node-version: "20"
```
JoshuaKGoldberg marked this conversation as resolved.
Show resolved Hide resolved

It's worth reading the [GitHub Actions documentation](https://docs.github.com/en/actions/creating-actions/creating-a-javascript-action#writing-the-action-code).

## How can I add dual CommonJS / ECMAScript Modules emit?

First, I'd suggest reading [TypeScript Handbook > Modules - Introduction](https://www.typescriptlang.org/docs/handbook/modules/introduction.html) to understand how CommonJS (CJS) and ECMAScript (ESM) came to be.
Expand Down
2 changes: 1 addition & 1 deletion script/__snapshots__/migrate-test-e2e.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,7 @@ exports[`expected file changes > cspell.json 1`] = `
"mtfoley",
"npmignore",
@@ ... @@
"packagejson",
"precommit",
"quickstart",
"tada",
+ "templating",
Expand Down
Loading