diff --git a/src/content/docs/pages/configuration/build-caching.mdx b/src/content/docs/pages/configuration/build-caching.mdx index f2a15dac4433e96..e510f3a2a236859 100644 --- a/src/content/docs/pages/configuration/build-caching.mdx +++ b/src/content/docs/pages/configuration/build-caching.mdx @@ -3,6 +3,8 @@ pcx_content_type: concept title: Build caching --- +import { DashButton, Steps } from "~/components"; + Improve Pages build times by caching dependencies and build output between builds with a project-wide shared cache. The first build to occur after enabling build caching on your Pages project will save to cache. Every subsequent build will restore from cache unless configured otherwise. @@ -52,16 +54,26 @@ The following limits are imposed for build caching: To enable build caching : -1. Navigate to [Workers & Pages Overview](https://dash.cloudflare.com) on the Dashboard. + +1. Go to the **Workers & Pages** in the Cloudflare dashboard. + + + 2. Find your Pages project. 3. Go to **Settings** > **Build** > **Build cache**. 4. Select **Enable** to turn on build caching. + ## Clear build cache The build cache can be cleared for a project if needed, such as when debugging build issues. To clear the build cache: -1. Navigate to [Workers & Pages Overview](https://dash.cloudflare.com) on the Dashboard. + +1. Go to the **Workers & Pages** in the Cloudflare dashboard. + + + 2. Find your Pages project. 3. Go to **Settings** > **Build** > **Build cache**. 4. Select **Clear Cache** to clear the build cache. + diff --git a/src/content/docs/pages/configuration/build-watch-paths.mdx b/src/content/docs/pages/configuration/build-watch-paths.mdx index 39de1b7f43f61e0..af85af31f42c263 100644 --- a/src/content/docs/pages/configuration/build-watch-paths.mdx +++ b/src/content/docs/pages/configuration/build-watch-paths.mdx @@ -3,14 +3,22 @@ pcx_content_type: concept title: Build watch paths --- +import { DashButton, Steps } from "~/components"; + When you connect a git repository to Pages, by default a change to any file in the repository will trigger a Pages build. You can configure Pages to include or exclude specific paths to specify if Pages should skip a build for a given path. This can be especially helpful if you are using a monorepo project structure and want to limit the amount of builds being kicked off. ## Configure paths To configure which paths are included and excluded: -1. In **Overview**, select your Pages project. -2. Go to **Settings** > **Build** > **Build watch paths**. Pages will default to setting your project’s includes paths to everything (\[\*]) and excludes paths to nothing (`[]`). + +1. Go to the **Workers & Pages** in the Cloudflare dashboard. + + + +2. Find your Pages project. +3. Go to **Settings** > **Build** > **Build watch paths**. Pages will default to setting your project's includes paths to everything (\[\*]) and excludes paths to nothing (`[]`). + The configuration fields can be filled in two ways: diff --git a/src/content/docs/pages/configuration/custom-domains.mdx b/src/content/docs/pages/configuration/custom-domains.mdx index 278484a3810b8ab..75fcc6331caf46e 100644 --- a/src/content/docs/pages/configuration/custom-domains.mdx +++ b/src/content/docs/pages/configuration/custom-domains.mdx @@ -3,7 +3,7 @@ pcx_content_type: how-to title: Custom domains --- -import { Render, DashButton } from "~/components"; +import { Render, DashButton, Steps } from "~/components"; When deploying your Pages project, you may wish to point custom domains (or subdomains) to your site. @@ -49,21 +49,23 @@ To ensure a custom domain is added successfully, you must go through the [Add a To detach a custom domain from your Pages project, you must modify your zone's DNS records. -First, log in to the Cloudflare dashboard > select your account in **Account Home** > select your website > **DNS**. + +1. Go to the **DNS Records** page for your website in the Cloudflare dashboard. -Then, in **DNS** > **Records**: + -1. Locate your Pages project's CNAME record. -2. Select **Edit**. -3. Select **Delete**. +2. Locate your Pages project's CNAME record. +3. Select **Edit**. +4. Select **Delete**. -Next, in the Cloudflare dashboard, go to the **Workers & Pages** page. +5. In the Cloudflare dashboard, go to the **Workers & Pages** page. - + -1. Select your Pages project. -2. Go to **Custom domains**. -3. Select the **three dot icon** next to your custom domain > **Remove domain**. +6. Select your Pages project. +7. Go to **Custom domains**. +8. Select the **three dot icon** next to your custom domain > **Remove domain**. + After completing these steps, your Pages project will only be accessible through the `*.pages.dev` subdomain you chose when creating your project. @@ -71,9 +73,11 @@ After completing these steps, your Pages project will only be accessible through To disable access to your project's provided `*.pages.dev` subdomain: + 1. Use Cloudflare Access over your previews (`*.{project}.pages.dev`). Refer to [Customize preview deployments access](/pages/configuration/preview-deployments/#customize-preview-deployments-access). 2. Redirect the `*.pages.dev` URL associated with your production Pages project to a custom domain. You can use the account-level [Bulk Redirect](/rules/url-forwarding/bulk-redirects/) feature to redirect your `*.pages.dev` URL to a custom domain. + ## Caching diff --git a/src/content/docs/pages/configuration/git-integration/index.mdx b/src/content/docs/pages/configuration/git-integration/index.mdx index 24ede8576e9dc4c..b683fdaa917d515 100644 --- a/src/content/docs/pages/configuration/git-integration/index.mdx +++ b/src/content/docs/pages/configuration/git-integration/index.mdx @@ -3,6 +3,8 @@ pcx_content_type: concept title: Git integration --- +import { Steps, DashButton } from "~/components"; + You can connect each Cloudflare Pages project to a [GitHub](/pages/configuration/git-integration/github-integration) or [GitLab](/pages/configuration/git-integration/gitlab-integration) repository, and Cloudflare will automatically deploy your code every time you push a change to a branch. :::note @@ -50,8 +52,14 @@ This can be useful for managing repository access or troubleshooting installatio If you are using a Git-integrated project and do not want to trigger deployments every time you push a commit, you can use [branch control](/pages/configuration/branch-build-controls/) to disable/pause builds: -1. Go to the **Settings** of your **Pages project** in the [Cloudflare dashboard](https://dash.cloudflare.com). -2. Navigate to **Build** > edit **Branch control** > turn off **Enable automatic production branch deployments**. -3. You can also change your Preview branch to **None (Disable automatic branch deployments)** to pause automatic preview deployments. + +1. Go to **Workers & Pages** in the Cloudflare dashboard. + + + +2. Select your Pages project. +3. Navigate to **Build** > edit **Branch control** > turn off **Enable automatic production branch deployments**. +4. You can also change your Preview branch to **None (Disable automatic branch deployments)** to pause automatic preview deployments. + Then, you can use Wrangler to deploy directly to your Pages project and make changes to your Git repository without automatically triggering a build. diff --git a/src/content/docs/pages/functions/bindings.mdx b/src/content/docs/pages/functions/bindings.mdx index 1a0035dad266e0f..e539b26ca7750ee 100644 --- a/src/content/docs/pages/functions/bindings.mdx +++ b/src/content/docs/pages/functions/bindings.mdx @@ -437,12 +437,13 @@ When developing locally using Wrangler, you can define an AI binding using the ` To configure a Workers AI binding via the Cloudflare dashboard: -1. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com) and select your account. -2. In **Account Home**, select **Workers & Pages**. -3. Select your Pages project > **Settings**. -4. Select your Pages environment > **Bindings** > **Add** > **Workers AI**. -5. Give your binding a name under **Variable name**. -6. Redeploy your project for the binding to take effect. +1. Go to the **Workers & Pages** page. + + +2. Select your Pages project > **Settings**. +3. Select your Pages environment > **Bindings** > **Add** > **Workers AI**. +4. Give your binding a name under **Variable name**. +5. Redeploy your project for the binding to take effect. ### Use Workers AI bindings diff --git a/src/content/docs/pages/how-to/npm-private-registry.mdx b/src/content/docs/pages/how-to/npm-private-registry.mdx index f24e28f7d755ea0..5de323ca8a6ef8b 100644 --- a/src/content/docs/pages/how-to/npm-private-registry.mdx +++ b/src/content/docs/pages/how-to/npm-private-registry.mdx @@ -4,6 +4,8 @@ title: Install private packages --- +import { Steps, DashButton } from "~/components"; + Cloudflare Pages supports custom package registries, allowing you to include private dependencies in your application. While this walkthrough focuses specifically on [npm](https://www.npmjs.com/), the Node package manager and registry, the same approach can be applied to other registry tools. You will be be adjusting the [environment variables](/pages/configuration/build-configuration/#environment-variables) in your Pages project's **Settings**. An existing website can be modified at any time, but new projects can be initialized with these settings, too. Either way, altering the project settings will not be reflected until its next deployment. @@ -70,8 +72,13 @@ Your Pages project must then have the matching [environment variables](/pages/co In the event that your local development no longer works with your new `.npmrc` file, you will need to add some additional changes: + 1. Rename the Pages-compliant `.npmrc` file to `.npmrc.pages`. This should be referencing environment variables. - 2. Restore your previous `.npmrc` file – the version that was previously working for you and your teammates. +3. Go to **Workers & Pages** in the Cloudflare dashboard. + + -3. Go to your Pages project > **Settings** > **Environment variables**, add a new [environment variable](/pages/configuration/build-configuration/#environment-variables) named [`NPM_CONFIG_USERCONFIG`](https://docs.npmjs.com/cli/v6/using-npm/config#npmrc-files) and set its value to `/opt/buildhome/repo/.npmrc.pages`. If your `.npmrc.pages` file is not in your project's root directory, adjust this path accordingly. +4. Select your Pages project. +5. Go to **Settings** > **Environment variables**, add a new [environment variable](/pages/configuration/build-configuration/#environment-variables) named [`NPM_CONFIG_USERCONFIG`](https://docs.npmjs.com/cli/v6/using-npm/config#npmrc-files) and set its value to `/opt/buildhome/repo/.npmrc.pages`. If your `.npmrc.pages` file is not in your project's root directory, adjust this path accordingly. + diff --git a/src/content/docs/pages/how-to/use-direct-upload-with-continuous-integration.mdx b/src/content/docs/pages/how-to/use-direct-upload-with-continuous-integration.mdx index 042a3ab05dcc747..c7cd6741bf7debf 100644 --- a/src/content/docs/pages/how-to/use-direct-upload-with-continuous-integration.mdx +++ b/src/content/docs/pages/how-to/use-direct-upload-with-continuous-integration.mdx @@ -38,7 +38,13 @@ Now that you have created your API token, you can use it to push your project fr ### Get project account ID -To find your account ID, log in to the Cloudflare dashboard > select your zone in **Account Home** > find your account ID in **Overview** under **API** on the right-side menu. If you have not added a zone, add one by selecting **Add** > **Connect a domain**. You can purchase a domain from [Cloudflare's registrar](/registrar/). +To find your account ID, go to the **Zone Overview** page in the Cloudflare dashboard. + + + +Find your account ID in the **API** section on the right-hand side menu. + +If you have not added a zone, add one by selecting **Add** > **Connect a domain**. You can purchase a domain from [Cloudflare's registrar](/registrar/). ## Use GitHub Actions diff --git a/src/content/docs/pages/migrations/migrating-from-netlify/index.mdx b/src/content/docs/pages/migrations/migrating-from-netlify/index.mdx index d5472add8013905..7a99667b6547cea 100644 --- a/src/content/docs/pages/migrations/migrating-from-netlify/index.mdx +++ b/src/content/docs/pages/migrations/migrating-from-netlify/index.mdx @@ -10,6 +10,8 @@ sidebar: --- +import { DashButton } from "~/components"; + In this tutorial, you will learn how to migrate your Netlify application to Cloudflare Pages. ## Finding your build command and build directory @@ -93,7 +95,11 @@ If you choose to use a custom domain for your Pages, you can set it to the same ## Cleaning up your old application and assigning the domain -In the Cloudflare dashboard, go to **DNS** > **Records** and review that you have updated the CNAME record for your domain from Netlify to Cloudflare Pages. With your DNS record updated, requests will go to your Pages application. +In the Cloudflare dashboard, go to the **DNS Records** page. + + + +Review that you have updated the CNAME record for your domain from Netlify to Cloudflare Pages. With your DNS record updated, requests will go to your Pages application. In **DNS**, your record's **Content** should be your `.pages.dev` subdomain.