docs(docusaurus): add npm2yarn plugin (#199)

* docs(docusaurus): add npm2yarn plugin * Create chilly-socks-act.md * docs: update
toss · Oct 5, 2023 · cbfbc02 · cbfbc02 · vercel · Oct 5, 2023
1 parent 936349d
commit cbfbc02
Show file tree

Hide file tree

Showing 12 changed files with 41 additions and 92 deletions.
diff --git a/.changeset/chilly-socks-act.md b/.changeset/chilly-socks-act.md
@@ -0,0 +1,6 @@
+---
+"@suspensive/react-query": patch
+"@suspensive/react": patch
+---
+
+docs(docusaurus): add npm2yarn plugin
diff --git a/packages/react-query/README.ko.md b/packages/react-query/README.ko.md
@@ -10,14 +10,6 @@
 
 @suspensive/react-query 는 npm에 있습니다. 최신 안정버전을 설치하기 위해 아래 커맨드를 실행하세요
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react-query
 ```
-
-```shell
-pnpm add @suspensive/react-query
-```
-
-```shell
-yarn add @suspensive/react-query
-```
diff --git a/packages/react-query/README.md b/packages/react-query/README.md
@@ -10,14 +10,6 @@
 
 @suspensive/react-query lives in npm. To install the latest stable version, run the following command
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react-query
 ```
-
-```shell
-pnpm add @suspensive/react-query
-```
-
-```shell
-yarn add @suspensive/react-query
-```
diff --git a/packages/react-query/src/QueryErrorResetBoundary.en.mdx b/packages/react-query/src/QueryErrorResetBoundary.en.mdx
@@ -49,18 +49,10 @@ const Example = () => (
 Below apis (QueryErrorBoundary, QueryAsyncBoundary) have peerDependency on @suspensive/react's ErrorBoundary, AsyncBoundary.
 So if you want to use these, you must install @suspensive/react first.
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react @suspensive/react-query
 ```
 
-```shell
-pnpm add @suspensive/react @suspensive/react-query
-```
-
-```shell
-yarn add @suspensive/react @suspensive/react-query
-```
-
 @suspensive/react-query provide QueryErrorBoundary, QueryAsyncBoundary to reduce repeating implementation like using QueryErrorResetBoundary + ErrorBoundary, QueryErrorResetBoundary + AsyncBoundary.
 
 ## QueryErrorBoundary

diff --git a/packages/react-query/src/QueryErrorResetBoundary.ko.mdx b/packages/react-query/src/QueryErrorResetBoundary.ko.mdx
@@ -49,18 +49,10 @@ const Example = () => (
 아래 api(QueryErrorBoundary, QueryAsyncBoundary)는 @suspensive/react의 ErrorBoundary, AsyncBoundary에 peerDependency를 갖습니다.
 따라서 이를 사용하려면 먼저 @suspensive/react를 설치해야 합니다.
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react @suspensive/react-query
 ```
 
-```shell
-pnpm add @suspensive/react @suspensive/react-query
-```
-
-```shell
-yarn add @suspensive/react @suspensive/react-query
-```
-
 @suspensive/react-query는 QueryErrorResetBoundary + ErrorBoundary, QueryErrorResetBoundary + AsyncBoundary와 같은 반복되는 구현을 줄이기 위해 QueryErrorBoundary, QueryAsyncBoundary를 제공합니다.
 
 ## QueryErrorBoundary

diff --git a/packages/react/README.ko.md b/packages/react/README.ko.md
@@ -10,14 +10,6 @@
 
 @suspensive/react 는 npm에 있습니다. 최신 안정버전을 설치하기 위해 아래 커맨드를 실행하세요
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react
 ```
-
-```shell
-pnpm add @suspensive/react
-```
-
-```shell
-yarn add @suspensive/react
-```
diff --git a/packages/react/README.md b/packages/react/README.md
@@ -10,14 +10,6 @@
 
 @suspensive/react lives in npm. To install the latest stable version, run the following command
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react
 ```
-
-```shell
-pnpm add @suspensive/react
-```
-
-```shell
-yarn add @suspensive/react
-```
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/websites/docs/docusaurus.config.js b/websites/docs/docusaurus.config.js
@@ -57,6 +57,15 @@ const config = {
               : defaultUrl
             return editUrl
           },
+          remarkPlugins: [
+            [
+              require('@docusaurus/remark-plugin-npm2yarn'),
+              {
+                sync: true,
+                converters: ['pnpm', 'yarn'],
+              },
+            ],
+          ],
         },
         theme: {
           customCss: require.resolve('./src/css/custom.css'),

diff --git a/websites/docs/intro/installation.en.md b/websites/docs/intro/installation.en.md
@@ -3,26 +3,8 @@ sidebar_position: 3
 title: Installation
 ---
 
-### npm
-
 The Suspensive package lives in npm. To install the latest stable version, run the following command
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react
 ```
-
-### pnpm
-
-Or if you're using <a href="https://pnpm.io/" target="_blank">pnpm</a>:
-
-```shell
-pnpm add @suspensive/react
-```
-
-### yarn
-
-Or if you're using <a href="https://classic.yarnpkg.com/en/docs/install/" target="_blank">yarn</a>:
-
-```shell
-yarn add @suspensive/react
-```
diff --git a/websites/docs/intro/installation.ko.md b/websites/docs/intro/installation.ko.md
@@ -3,26 +3,8 @@ sidebar_position: 3
 title: 설치하기
 ---
 
-### npm
-
 @suspensive/react는 npm에 있습니다. 최신 안정버전을 설치하기 위해 아래 커맨드를 실행하세요
 
-```shell
+```shell npm2yarn
 npm install @suspensive/react
 ```
-
-### pnpm
-
-혹은 <a href="https://pnpm.io/" target="_blank">pnpm</a>을 사용한다면:
-
-```shell
-pnpm add @suspensive/react
-```
-
-### yarn
-
-혹은 <a href="https://classic.yarnpkg.com/en/docs/install/" target="_blank">yarn</a>을 사용한다면:
-
-```shell
-yarn add @suspensive/react
-```
diff --git a/websites/docs/package.json b/websites/docs/package.json
@@ -36,6 +36,7 @@
   "dependencies": {
     "@docusaurus/core": "2.4.1",
     "@docusaurus/preset-classic": "2.4.1",
+    "@docusaurus/remark-plugin-npm2yarn": "^2.4.3",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.2.1",
     "prism-react-renderer": "^1.3.5",