npmpackage.info

Gathering detailed insights and metrics for @mdx-js/loader

Other packages similar to @mdx-js/loader

@mdx-js/vue-loader

2.0.0

Deprecated: this package is no longer maintained.

@mdx-js/node-loader

3.1.0

Node.js loader for MDX

mdx-frontmatter-loader

0.1.1

frontmatter loader for @mdx-js

jest-mdx-loader

0.1.1

Jest transformer that wraps mdx-js/mx webpack loader

Gathering detailed insights and metrics for @mdx-js/loader

@mdx-js/loader - 3.1.0 | npmpackage.info

@mdx-js/loader

Markdown for the component era

3.1.0

18,561

MIT

JavaScript

14.73 kB

4.7

Installations

npm install @mdx-js/loader

Developer Guide

BETA

Typescript

No

Module System

ESM

Node Version

23.0.0

NPM Version

10.9.0 Score

84.3

Supply Chain

65.6

Quality

80.6

Maintenance

100

Vulnerability

100

License

Pull Requests

Open

9

Total

1,438

Closed

326

Merged

1,103

Issues

Open

7

Total

683

Closed

676

Releases

119

3.1.0

Updated on Oct 18, 2024

3.0.1

Updated on Feb 12, 2024

3.0.0

Updated on Oct 24, 2023

2.3.0

Updated on Feb 09, 2023

2.2.1

Updated on Dec 14, 2022

2.2.0

Updated on Dec 14, 2022

View All 119 releases

Languages

JavaScript

MDX

JavaScript (100%)

Developer

mdx-js

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

MIT License

18,561 Stars

1,760 Commits

1,157 Forks

87 Watchers

12 Branches

188 Contributors

Updated on Jun 29, 2025

Sponsor this package

https://opencollective.com/unified

Maintainers

View All 188 Contributors

Package Meta Information

Latest Version

3.1.0

Package Id

@mdx-js/loader@3.1.0

Unpacked Size

14.73 kB

Size

5.66 kB

File Count

NPM Version

10.9.0

Node Version

23.0.0

Published on

Oct 18, 2024

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

@mdx-js/mdx source-map

Peer Dependencies

webpack

`@mdx-js/loader`

webpack loader for MDX.

What is this?
When should I use this?
Install
Use
API
- mdx
- Options
Examples
- Combine with Babel
Types
Compatibility
Security
Contribute
License

What is this?

This package is a webpack loader to support MDX.

When should I use this?

This integration is useful if you’re using webpack (or another tool that uses webpack, such as Next.js or Rspack).

This integration can be combined with the Babel loader to compile modern JavaScript features to ones your users support.

If you want to evaluate MDX code then the lower-level compiler (@mdx-js/mdx) can be used manually.

Install

This package is ESM only. In Node.js (version 16+), install with npm:

1npm install @mdx-js/loader

Use

Add something along these lines to your webpack.config.js:

1/**
2 * @import {Options} from '@mdx-js/loader'
3 * @import {Configuration} from 'webpack'
4 */
5
6/** @type {Configuration} */
7const webpackConfig = {
8  module: {
9    // …
10    rules: [
11      // …
12      {
13        test: /\.mdx?$/,
14        use: [
15          {
16            loader: '@mdx-js/loader',
17            /** @type {Options} */
18            options: {/* jsxImportSource: …, otherOptions… */}
19          }
20        ]
21      }
22    ]
23  }
24}
25
26export default webpackConfig

See also ¶ Next.js and ¶ Vue CLI, if you’re using webpack through them, for more info.

API

This package exports no identifiers. The default export is mdx.

`mdx`

This package exports a webpack plugin as the default export. Configuration (see Options) are passed separately through webpack.

`Options`

Configuration (TypeScript type).

Options are the same as CompileOptions from @mdx-js/mdx with the exception that the SourceMapGenerator and development options are supported based on how you configure webpack. You cannot pass them manually.

Examples

Combine with Babel

If you use modern JavaScript features you might want to use Babel through babel-loader to compile to code that works in older browsers:

1/**
2 * @import {Options} from '@mdx-js/loader'
3 * @import {Configuration} from 'webpack'
4 */
5
6/** @type {Configuration} */
7const webpackConfig = {
8  module: {
9    // …
10    rules: [
11      // …
12      {
13        test: /\.mdx?$/,
14        use: [
15          // Note that Webpack runs right-to-left: `@mdx-js/loader` is used first, then
16          // `babel-loader`.
17          {loader: 'babel-loader', options: {}},
18          {
19            loader: '@mdx-js/loader',
20            /** @type {Options} */
21            options: {}
22          }
23        ]
24      }
25    ]
26  }
27}
28
29export default webpackConfig

Types

This package is fully typed with TypeScript. It exports the additional type Options. See § Types on our website for information.

Compatibility

Projects maintained by the unified collective are compatible with maintained versions of Node.js.

When we cut a new major release, we drop support for unmaintained versions of Node. This means we try to keep the current release line, @mdx-js/loader@^3, compatible with Node.js 16.

Security

See § Security on our website for information.

Contribute

See § Contribute on our website for ways to get started. See § Support for ways to get help.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

License

No vulnerabilities found.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

10

Security-Policy

Determines if the project has published a security policy.

7

Maintained

Determines if the project is "actively maintained".

6

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

4

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

Reason

dependency not pinned by hash detected -- score normalized to 4

Details

Warn: third-party GitHubAction not pinned by hash: .github/workflows/bb.yml:5: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/bb.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:8: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/main.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:11: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/main.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:33: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/main.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:36: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/main.yml/main?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/main.yml:42: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/main.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/website.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/website.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/website.yml:15: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/website.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/website.yml:20: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/website.yml/main?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/website.yml:23: update your workflow using https://app.stepsecurity.io/secureworkflow/mdx-js/mdx/website.yml/main?enable=pin
Info: 0 out of 8 GitHub-owned GitHubAction dependencies pinned
Info: 0 out of 2 third-party GitHubAction dependencies pinned
Info: 3 out of 3 npmCommand dependencies pinned

1

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

Score

4.7

/10

Last Scanned on 2025-06-23

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

Other packages similar to @mdx-js/loader

Other packages similar to @mdx-js/loader

@mdx-js/loader

Installations

Developer Guide

No

ESM

23.0.0

10.9.0

Score

Pull Requests

9

1,438

326

1,103

Issues

7

683

676

Releases

Languages

Developer

Download Statistics

GitHub Statistics

Sponsor this package

Maintainers

Package Meta Information

Total Downloads

NaN

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

Peer Dependencies

@mdx-js/loader

Contents

What is this?

When should I use this?

Install

Use

API

mdx

Options

Examples

Combine with Babel

Types

Compatibility

Security

Contribute

License

10

10

10

10

7

6

4

1

0

0

0

0

0

4.7

/10

`@mdx-js/loader`

`mdx`

`Options`