From 86112afaefeaeccb61ded42d62342a66af62b22d Mon Sep 17 00:00:00 2001 From: Adam Skoufis Date: Mon, 8 Jul 2024 11:52:09 +1000 Subject: [PATCH] Document how to use the `babel-loader` cache in CI (#1008) --- docs/docs/extra-features.md | 51 +++++++++++++++++++++++++++++++++++++ docs/index.html | 1 + 2 files changed, 52 insertions(+) diff --git a/docs/docs/extra-features.md b/docs/docs/extra-features.md index 8cf9e2744..7163aef39 100644 --- a/docs/docs/extra-features.md +++ b/docs/docs/extra-features.md @@ -81,6 +81,57 @@ For applications with a large number of source files and/or dependencies, this c [`babel-loader` cache]: https://github.com/babel/babel-loader?tab=readme-ov-file#options +### Utilizing the `babel-loader` cache in CI + +#### Buildkite + +To utilize the `babel-loader` cache in Buildkite, you can use the [cache plugin] to cache the `node_modules/.cache/babel-loader` directory. + +> The example below stores the cache in an S3 bucket. +> It is recommended to add a [lifecycle configuration] to your bucket in order to automatically delete old cache files. + +```yaml +# .buildkite/pipeline.yaml +plugins: + # Add these items to your pipeline steps that run `sku build` + - cache#v1.0.1: + path: ./node_modules/.cache/babel-loader + restore: pipeline + save: file + manifest: pnpm-lock.yaml + backend: s3 + compression: tgz + # Second cache plugin entry creates a pipeline-level cache as a stale fallback if the manifest doesn't match. + # Ideally this would be defined in a single cache plugin entry. + # See https://github.com/buildkite-plugins/cache-buildkite-plugin/issues/70 + - cache#v1.0.1: + path: ./node_modules/.cache/babel-loader + save: pipeline + backend: s3 + compression: tgz +``` + +[cache plugin]: https://github.com/buildkite-plugins/cache-buildkite-plugin +[lifecycle configuration]: https://docs.aws.amazon.com/AWSCloudFormation/latest/UserGuide/aws-properties-s3-bucket-lifecycleconfiguration.html + +#### GitHub actions + +To utilize the `babel-loader` cache in GitHub actions, you can use the [cache action] to cache the `node_modules/.cache/babel-loader` directory. + +```yaml +# .github/workflows/deploy-site.yaml +# Add this step before the step that runs `sku build` +- name: Cache babel-loader + id: cache-babel-loader + uses: actions/cache@v4 + with: + path: 'node_modules/.cache/babel-loader' + key: babel-loader-${{ runner.os }}-${{ hashFiles('./pnpm-lock.yaml') }} + restore-keys: babel-loader-${{ runner.os }}- +``` + +[cache action]: https://github.com/actions/cache + ## Bundle analysis `sku` comes with bundle analysis built in via [webpack-bundle-analyzer](https://www.npmjs.com/package/webpack-bundle-analyzer). diff --git a/docs/index.html b/docs/index.html index 083d402b9..8bea1b188 100644 --- a/docs/index.html +++ b/docs/index.html @@ -110,6 +110,7 @@ +