Package Exports

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-seo-analyzer) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React SEO Analyzer

Overview

React SEO Analyzer is a utility package that helps developers identify common SEO issues in their React applications. It checks for missing meta tags, improper alt attributes on images, multiple H1 tags, and more.

Features

Detect missing <title> tags.
Check for a meta description and validate its length.
Identify images missing alt attributes.
Validate the presence of a canonical link.
Ensure proper usage of <h1> tags.
Check external links for proper rel attributes (e.g., nofollow, noopener).

Installation

Install the package via npm:

npm install react-seo-analyzer

Usage

Import and use the SEOAnalyzer component in your React application. It analyzes the DOM and logs SEO issues in the console.

Example:

import React from 'react';
import SEOAnalyzer from 'react-seo-analyzer';

const App = () => {
  return (
    <div>
      <SEOAnalyzer />
      <h1>Welcome to My Website</h1>
      <p>This is a sample website for demonstrating the React SEO Analyzer.</p>
    </div>
  );
};

export default App;

Console Output:

If issues are found, they will be logged as warnings:

SEO Analyzer Issues:
["Missing <title> tag.", "Found 2 images without alt attributes."]

If no issues are detected:

SEO Analyzer: No issues detected.