Skip to content

0.1.0

Compare
Choose a tag to compare
@schickling schickling released this 11 Feb 13:55
· 353 commits to main since this release
a927be7

🚨 This release contains two (2) breaking changes. See Upgrading below for more information and instructions on brings your project up to date.

Changes

💥 [Breaking] Generated files are now placed in a .contentlayer/generated directory at the root of the project. See Updating below for details. #65 #113
💥 [Breaking] bodyType will be replaced by contentType. See Upgrading below for details.

✨ The full markdown (or MDX) file content (including the frontmatter) will be passed to remark/rehype plugins during process only for the main body of the file. #106
✨ Live-reloading in Next.js via the useLiveReload has been improved. Reloading no longer scrolls to the top of the page and fixes a bug mentioned in #109.
✨ Types are generated as part of the npm postinstall script. This ensures types will exist right after cloning the project. #114 (also provides a workaround for #118)
✨ Improve type generation. #69 #89
✨ Upgrade to MDX v2 (via mdx-bundler@8).

Upgrading

The following sections outline breaking changes introduced in this version. Follow the steps below to upgrade your project.

1. New Directory for Generated Files

The .contentlayer directory was previously symlinked to a directory within node modules that caused a number of problems. By generating directly to a .contentlayer/generated directory, we see the following benefits:

  • Live reload of schema changes now work without having to restart TypeScript server in VS Code. #65
  • Auto-import works.
  • Symlinks are no longer needed.
  • Easier process to learn for new users.

Upgrade steps:

  1. Delete node_modules/.contentlayer folder and .contentlayer symlink.

  2. Add the new directory to your tsconfig.json / jsconfig.json as shown below:

    {
      "compilerOptions": {
        "baseUrl": ".",
        "paths": {
          "contentlayer/generated": ["./.contentlayer/generated"]
    //    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
        }
      },
      "include": ["next-env.d.ts", "**/*.tsx", "**/*.ts", ".contentlayer/generated"]
    //                                                  ^^^^^^^^^^^^^^^^^^^^^^^^^^^
    }
  3. Rename import statements from .contentlayer/data and .contentlayer/types to contentlayer/generated

// old
import { allPosts } from ".contentlayer/data"
import { Post } from ".contentlayer/types"

// new
import { allPosts, Post } from "contentlayer/generated"

2. Processing Main Content of a markdown/MDX File

bodyType has been deprecated in favor of contentType. The new options for contentType are markdown or mdx. This determines how the main body content will be processed.

This fixes an issue in which a .md was (intentionally) using MDX code in its main body area. This is now possible by specifying mdx as the contentType in the document type definition.

Upgrade steps:

  • If you weren't using bodyType in your document definitions, then you don't need to do anything.

  • If you were using markdown or mdx as the bodyType for a document type definition, change bodyType to contentType.

    // old
    defineDocumentType(() => ({
      name: "Page",
      filePathPattern: `**/*.mdx`,
      bodyType: "mdx"
    })
    
    // new
    defineDocumentType(() => ({
      name: "Page",
      filePathPattern: `**/*.mdx`,
      contentType: "mdx"
    })
  • If you were using bodyType and had it set to none, remove it. The body will be assumed to be an empty string if there is no content, but the property will always exist in the output document.

    // old
    defineDocumentType(() => ({
      name: "Page",
      filePathPattern: `**/*.md`,
      bodyType: "none"
    })
    
    // new
    defineDocumentType(() => ({
      name: "Page",
      filePathPattern: `**/*.md`
    })