mirror of
https://github.com/MaggieAppleton/digital-gardeners.git
synced 2025-09-23 08:43:40 +02:00
switched to mdx
This commit is contained in:
parent
1d7be78e38
commit
67b393a1f0
12 changed files with 16 additions and 9 deletions
|
@ -6,7 +6,7 @@ import Container from "../components/Container";
|
|||
import Layout from "../components/Layout";
|
||||
import Sidemenu from "../components/Sidemenu";
|
||||
import Card from "../components/Card";
|
||||
import { gardensFilePath, GARDENS_PATH } from "../utils/mdUtils";
|
||||
import { gardenFilePath, GARDENS_PATH } from "../utils/mdxUtils";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function Index({ posts }) {
|
||||
|
@ -65,7 +65,7 @@ export default function Index({ posts }) {
|
|||
}
|
||||
|
||||
export function getStaticProps() {
|
||||
const posts = gardensFilePath.map((filePath) => {
|
||||
const posts = gardenFilePath.map((filePath) => {
|
||||
const source = fs.readFileSync(path.join(GARDENS_PATH, filePath));
|
||||
const { content, data } = matter(source);
|
||||
|
||||
|
|
|
@ -5,18 +5,21 @@ import { serialize } from "next-mdx-remote/serialize";
|
|||
import dynamic from "next/dynamic";
|
||||
import Head from "next/head";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import path from "path";
|
||||
import Layout from "../../components/Layout";
|
||||
import { gardensFilePath, GARDENS_PATH } from "../../utils/mdUtils";
|
||||
import { gardenFilePath, GARDENS_PATH } from "../../utils/mdxUtils";
|
||||
|
||||
// Custom components/renderers to pass to MDX.
|
||||
// Since the MDX files aren't loaded by webpack, they have no knowledge of how
|
||||
// to handle import statements. Instead, you must include components in scope
|
||||
// here.
|
||||
const components = {
|
||||
img: (props) => <Image {...props} layout="fill" loading="lazy" />,
|
||||
// It also works with dynamically-imported components, which is especially
|
||||
// useful for conditionally loading components for certain routes.
|
||||
// See the notes in README.md for more details.
|
||||
// TestComponent: dynamic(() => import("../../components/TestComponent")),
|
||||
Head,
|
||||
};
|
||||
|
||||
|
@ -42,7 +45,7 @@ export default function GardenPage({ source, frontMatter }) {
|
|||
}
|
||||
|
||||
export const getStaticProps = async ({ params }) => {
|
||||
const gardenFilePath = path.join(GARDENS_PATH, `${params.slug}.md`);
|
||||
const gardenFilePath = path.join(GARDENS_PATH, `${params.slug}.mdx`);
|
||||
const source = fs.readFileSync(gardenFilePath);
|
||||
|
||||
const { content, data } = matter(source);
|
||||
|
@ -65,9 +68,9 @@ export const getStaticProps = async ({ params }) => {
|
|||
};
|
||||
|
||||
export const getStaticPaths = async () => {
|
||||
const paths = gardensFilePath
|
||||
const paths = gardenFilePath
|
||||
// Remove file extensions for page paths
|
||||
.map((path) => path.replace(/\.md?$/, ""))
|
||||
.map((path) => path.replace(/\.mdx?$/, ""))
|
||||
// Map the path into the static paths object required by Next.js
|
||||
.map((slug) => ({ params: { slug } }));
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue