facebook / facebook/docusaurus

Allow custom babel config for content plugins

オープン
#4,035 コメント 6 件 リアクション 0 件 担当者 0 名 GitHub で見る
feature
主要言語
TypeScript
スター
66.2k
フォーク
10k
平均マージ
1日 3時間
マージ済み PR(30日)
52

説明

## 🚀 Feature

### Have you read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/master/CONTRIBUTING.md#reporting-new-issues)?

Yes

## Motivation

I want to use tailwindcss in my docs/blog/pages.

You can see here the `createMDXLoaderRule` hardcodes the babel loader and doesn't allow configuring the `babelOptions`.

```
function createMDXLoaderRule(): RuleSetRule {
return {
test: /(\.mdx?)$/,
include: flatten(versionsMetadata.map(getDocsDirPaths))
// Trailing slash is important, see https://github.com/facebook/docusaurus/pull/3970
.map(addTrailingPathSeparator),
use: compact([
getCacheLoader(isServer),
getBabelLoader(isServer),
{
```

```
export function getBabelLoader(
isServer: boolean,
babelOptions?: TransformOptions | string,
): Loader {
return {
loader: require.resolve('babel-loader'),
options: getBabelOptions({isServer, babelOptions}),
};
}
```

```
export function getBabelOptions({
isServer,
babelOptions,
}: {
isServer?: boolean;
babelOptions?: TransformOptions | string;
} = {}): TransformOptions {
if (typeof babelOptions === 'string') {
return {
babelrc: false,
configFile: babelOptions,
caller: {name: isServer ? 'server' : 'client'},
};
} else {
return Object.assign(
babelOptions ?? {presets: [require.resolve('../babel/preset')]},
{
babelrc: false,
configFile: false,
caller: {name: isServer ? 'server' : 'client'},
},
);
}
}
```

## Pitch

The easy fix is to add `babelOptions` to the plugin config and pass it through.

---

Issue was identified thanks to: https://github.com/ben-rogerson/twin.macro/issues/125#issuecomment-677694758

コントリビューションガイド

コントリビューションガイドを開く

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。