Nuxt SEO Layer

A Nuxt layer that provides essential SEO configuration for Nuxt projects, including sitemap generation, robots.txt, and automated linting.

Features

• Sitemap generation via @nuxtjs/sitemap
• Robots.txt configuration via @nuxtjs/robots
• ESLint integration with stylistic rules
• Optimized for search engine visibility

Configuration

The SEO layer includes the following modules:

// nuxt.config.ts in the seo layer
export default defineNuxtConfig({
  modules: ["@nuxtjs/sitemap", "@nuxtjs/robots", "@nuxt/eslint"],
  eslint: {
    config: {
      stylistic: true
    }
  }
})

Development

# Install dependencies
npm install

# Start development server
npm run dev

# Run ESLint
npm run lint

# Fix linting issues automatically
npm run lint:fix

# Run TypeScript type checking
npm run typecheck

Usage

To use this layer in your Nuxt project:

// nuxt.config.ts
export default defineNuxtConfig({
  extends: [
    '@cooperco/nuxt-layer-seo'
  ]
})

This will automatically include the SEO layer features.

Dependencies

The SEO layer includes:

• @nuxtjs/sitemap
• @nuxtjs/robots
• @nuxt/eslint

These provide a solid SEO foundation for your Nuxt application.

Publishing to npm (tag-based)

This layer is published using GitHub Actions when you push a tag that matches the seo-vX.Y.Z pattern.

High-level flow:

• Bump the version in layers/seo/package.json (SemVer).
• Commit and push your changes to main (or ensure the commit is on main).
• Create and push a tag named seo-vX.Y.Z (matching the package.json version).
• The Publish SEO Layer workflow installs deps, checks if that exact version already exists on npm, and if not, publishes to npm.

Important notes:

• Do NOT rely on npm version creating a tag for you (it will create vX.Y.Z). We use a custom tag prefix seo-v.
• The workflow will skip if the version already exists.

Step-by-step

1. Bump the version in layers/seo/package.json

• Option A (recommended): use npm version without creating a tag
  • Bash:

    cd layers/seo
    npm version patch --no-git-tag-version  # or minor | major

  • PowerShell:

    Set-Location layers/seo
    npm version patch --no-git-tag-version  # or minor | major

• Option B: manually edit the version field in layers/seo/package.json (SemVer: MAJOR.MINOR.PATCH)

2. Commit and push the change (from repo root or layers/seo)

git add layers/seo/package.json
git commit -m "chore(seo): bump version"
git push origin main

3. Create and push the tag using the new version

• Get the new version value:
  • Bash:

    cd layers/seo
    VERSION=$(node -p "require('./package.json').version")
    cd ../..
    git tag "seo-v$VERSION"
    git push origin "seo-v$VERSION"

  • PowerShell:

    Set-Location layers/seo
    $version = node -p "require('./package.json').version"
    Set-Location ../..
    git tag "seo-v$version"
    git push origin "seo-v$version"

4. GitHub Actions will publish

• Workflow: .github/workflows/publish-seo.yml
• Auth: uses NPM_TOKEN configured as a GitHub secret
• Behavior: installs, checks npm view @cooperco/nuxt-layer-seo@<version>, publishes if not found

Troubleshooting

• Version already exists: bump the version again (patch/minor/major) and push a new tag.
• Auth errors (401/403): ensure NPM_TOKEN is set in repo secrets and org access is correct.