{"id":20949643,"url":"https://github.com/bitttttten/jest-transformer-mdx","last_synced_at":"2025-05-14T03:32:08.700Z","repository":{"id":50956325,"uuid":"193904559","full_name":"bitttttten/jest-transformer-mdx","owner":"bitttttten","description":"A jest transformer for MDX with frontMatter support","archived":false,"fork":false,"pushed_at":"2021-05-26T21:44:31.000Z","size":1255,"stargazers_count":12,"open_issues_count":1,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-08T23:49:10.847Z","etag":null,"topics":["frontmatter","jest","mdx"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bitttttten.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"ko_fi":"bitttttten"}},"created_at":"2019-06-26T12:57:06.000Z","updated_at":"2023-12-06T00:59:19.000Z","dependencies_parsed_at":"2022-08-28T17:21:35.221Z","dependency_job_id":null,"html_url":"https://github.com/bitttttten/jest-transformer-mdx","commit_stats":null,"previous_names":["bitttttten/jest-transformer-md"],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bitttttten%2Fjest-transformer-mdx","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bitttttten%2Fjest-transformer-mdx/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bitttttten%2Fjest-transformer-mdx/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bitttttten%2Fjest-transformer-mdx/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bitttttten","download_url":"https://codeload.github.com/bitttttten/jest-transformer-mdx/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225274533,"owners_count":17448286,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["frontmatter","jest","mdx"],"created_at":"2024-11-19T00:41:18.635Z","updated_at":"2024-11-19T00:41:19.343Z","avatar_url":"https://github.com/bitttttten.png","language":"JavaScript","funding_links":["https://ko-fi.com/bitttttten"],"categories":[],"sub_categories":[],"readme":"# jest-transformer-mdx\n\n[![Github release version](https://img.shields.io/github/tag/bitttttten/jest-transformer-mdx.svg)](https://github.com/bitttttten/jest-transformer-mdx/releases)\n[![Commits since release](https://img.shields.io/github/commits-since/bitttttten/jest-transformer-mdx/v2.2.0.svg)](https://github.com/bitttttten/jest-transformer-mdx/compare/v2.2.0...master)\n[![npm release version](https://img.shields.io/npm/v/jest-transformer-mdx.svg)](https://www.npmjs.com/package/jest-transformer-mdx)\n\n## Introduction\n\nJest transformer for [MDX](https://mdxjs.com/) with [frontMatter](https://github.com/c8r/x0/blob/master/lib/mdx-fm-loader.js) support.\n\n## Instructions\n\n### Install\n\n`yarn add jest-transformer-mdx`\n\n### Add to your jest config\n\n```js\n// jest.config.js\nmodule.exports = {\n\t// A map from regular expressions to paths to transformers\n\ttransform: {\n\t\t\"^.+\\\\.(md|mdx)$\": \"jest-transformer-mdx\",\n\t},\n}\n```\n\nAnd that should be it! `jest-transformer-mdx` will pick up your babel config and use your jest config.\n\n### jest 26 or below\n\nTo support jest 26 or below, please install at version 2. Version 3 only supports jest 27 and above.\n\n`yarn add jest-transformer-mdx@2`\n\n### Example\n\nLook inside [this library's test](https://github.com/bitttttten/jest-transformer-mdx/blob/master/test.js) and the related [markdown file](https://github.com/bitttttten/jest-transformer-mdx/blob/master/test.md) to see live a example.\n\n### Configuration\n\nYou can configure this transformer by using a different syntax in your jest config, an array of the path to the transformer followed by an options object.\n\n#### Options\n\n#### frontMatterName\n\n```js\n// jest.config.js\nmodule.exports = {\n\ttransform: {\n\t\t\"^.+\\\\.(md|mdx)$\": [\n\t\t\t\"jest-transformer-mdx\",\n\t\t\t{\n\t\t\t\tfrontMatterName: \"meta\",\n\t\t\t\tmdxOptions: {\n\t\t\t\t\trehypePlugins: [require(\"rehype-slug\")],\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t},\n}\n```\n\nUse this option to rename the exported frontMatter object. This module exports the frontMatter object named as \"frontMatter\", so [in your component and tests](https://github.com/bitttttten/jest-transformer-mdx/blob/d23701d641f826fface8511e70734073ca2ad29b/test.js#L2) you could only access the frontMatter object through `require('./hello-world.mdx').frontMatter`. If this does not suite your workflow, then use this option to rename it.\n\n#### mdxOptions\n\n```js\n// jest.config.js\nmodule.exports = {\n\ttransform: {\n\t\t\"^.+\\\\.(md|mdx)$\": [\n\t\t\t\"jest-transformer-mdx/mdx-options\",\n\t\t\t{\n\t\t\t\tfrontMatterName: \"meta\",\n\t\t\t\tmdxOptions: {\n\t\t\t\t\trehypePlugins: [require(\"rehype-slug\")],\n\t\t\t\t},\n\t\t\t},\n\t\t],\n\t},\n}\n```\n\nNote: edit your transform property to import from `jest-transformer-mdx/mdx-options`.\n\nUse this option to configure mdx. Perhaps you have added some custom plugins, and need that reflected in this transformer. Note that you can either pass in an inline object like the above example, or you can pass in a path to a file that exports your mdx options like the below example, which is useful if your mdx options is not JSON-serializable:\n\n```js\n// jest.config.js\nmodule.exports = {\n\ttransform: {\n\t\t\"^.+\\\\.(md|mdx)$\": [\n\t\t\t\"jest-transformer-mdx\",\n\t\t\t{\n\t\t\t\tmdxOptions: \"config/mdx-options.js\",\n\t\t\t},\n\t\t],\n\t},\n}\n```\n\n```js\n// config/mdx-options.js\nconst options = {\n\trehypePlugins: [rehypeSlug],\n}\n\nmodule.exports = options\n```\n\n#### Interface\n\n```ts\ninterface Options {\n\t// rename the object that the frontmatter object will get exported as\n\tfrontMatterName?: string\n}\n```\n\n### create-react-app \u0026 configless\n\nYou can also use this module in `create-react-app`-like apps where the config is not exposed. Edit your transform property to import from `jest-transformer-mdx/cra`. This method does not support any of the configuration options mentioned above yet.\n\n```js\n// jest.config.js\nmodule.exports = {\n\ttransform: {\n\t\t\"^.+\\\\.(md|mdx)$\": \"jest-transformer-mdx/cra\",\n\t},\n}\n```\n\n## Credits\n\nMade possible by\n\n\u003ca href=\"https://soulpicks.com\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars0.githubusercontent.com/u/37078572?s=200\u0026v=4\" width=\"64\" height=\"64\"\u003e\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbitttttten%2Fjest-transformer-mdx","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbitttttten%2Fjest-transformer-mdx","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbitttttten%2Fjest-transformer-mdx/lists"}