Nail Polishing Minions

    remix-seo
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.0 • Public • Published

    remix-seo

    A package for easily managing SEO meta and link tags in Remix.

    WIP!

    Usage

    // app/seo.ts
    import { initSeo } from "../src/index";
    export const { getSeo, getSeoMeta, getSeoLinks } = getSeo({
    	// Pass any SEO defaults for your site here.
    	// If individual routes do not provide their own meta and link tags,
    	// the tags generated by the defaults will be used.
    	title: "The Awesome Store",
    	titleTemplate: "%s | The Awesome Store",
    	description: "The most awesome store on planet Earth.",
    });
    
    // app/root.tsx
    import { getSeo } from "~/seo";
    let [seoMeta, seoLinks] = getSeo();
    
    export let meta = () => ({ ...seoMeta, { whatever: "cool" } });
    export let links = () => [ ...seoLinks, { rel: "stylesheet", href: "/sick-styles.css" } ];
    
    // app/routes/some-route.tsx
    import { getSeo, getSeoMeta, getSeoLinks } from "~/seo";
    
    // No need for route data? Get meta and links in one call.
    let [seoMeta, seoLinks] = getSeo({
    	title: "About us",
    	description: "We are great!",
    });
    
    // SEO depends on route data?
    // call getSeoMeta and getSeoLinks individually in the relevant function.
    export let meta = ({ context }) => {
    	let seoMeta = getSeoMeta({
    		title: `Welcome ${context.name}`
    	});
    	return {
    		...seoMeta,
    	};
    };
    export let links = ({ context }) => {
    	let seoLinks = getSeoLinks({
    		title: `Welcome ${context.name}`
    	});
    	return [...seoLinks];
    };

    Install

    npm i remix-seo

    DownloadsWeekly Downloads

    289

    Version

    0.1.0

    License

    MIT

    Unpacked Size

    54.6 kB

    Total Files

    5

    Last publish

    Collaborators

    • chancestrickland