1.0.3 • Published 7 months ago
react-seo-analyzer v1.0.3
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.