docs: copying installation commands made easy (#8101)

TanStack · Sep 26, 2024 · 92e5672 · 92e5672
1 parent 542528a
commit 92e5672
Show file tree

Hide file tree

Showing 9 changed files with 130 additions and 50 deletions.
diff --git a/docs/eslint/eslint-plugin-query.md b/docs/eslint/eslint-plugin-query.md
@@ -10,11 +10,19 @@ TanStack Query comes with its own ESLint plugin. This plugin is used to enforce
 The plugin is a separate package that you need to install:
 
 ```bash
-$ npm i -D @tanstack/eslint-plugin-query@4
-# or
-$ pnpm add -D @tanstack/eslint-plugin-query@4
-# or
-$ yarn add -D @tanstack/eslint-plugin-query@4
+npm i -D @tanstack/eslint-plugin-query@4
+```
+
+or
+
+```bash
+pnpm add -D @tanstack/eslint-plugin-query@4
+```
+
+or
+
+```bash
+yarn add -D @tanstack/eslint-plugin-query@4
 ```
 
 ## Usage

diff --git a/docs/framework/react/community/liaoliao666-react-query-kit.md b/docs/framework/react/community/liaoliao666-react-query-kit.md
@@ -19,11 +19,19 @@ This module is distributed via [NPM](https://www.npmjs.com/package/react-query-k
 should be installed as one of your project's `dependencies`:
 
 ```bash
-$ npm i react-query-kit
-# or
-$ pnpm add react-query-kit
-# or
-$ yarn add react-query-kit
+npm i react-query-kit
+```
+
+or
+
+```bash
+pnpm add react-query-kit
+```
+
+or
+
+```bash
+yarn add react-query-kit
 ```
 
 ## Quick start with nextjs

diff --git a/docs/framework/react/community/lukemorales-query-key-factory.md b/docs/framework/react/community/lukemorales-query-key-factory.md
@@ -10,11 +10,19 @@ Typesafe query key management with auto-completion features. Focus on writing an
 You can install Query Key Factory via [NPM](https://www.npmjs.com/package/@lukemorales/query-key-factory).
 
 ```bash
-$ npm i @lukemorales/query-key-factory
-# or
-$ pnpm add @lukemorales/query-key-factory
-# or
-$ yarn add @lukemorales/query-key-factory
+npm i @lukemorales/query-key-factory
+```
+
+or
+
+```bash
+pnpm add @lukemorales/query-key-factory
+```
+
+or
+
+```bash
+yarn add @lukemorales/query-key-factory
 ```
 
 

diff --git a/docs/framework/react/community/suspensive-react-query.md b/docs/framework/react/community/suspensive-react-query.md
@@ -14,11 +14,19 @@ You don't even need to use the isSuccess flag.
 You can install @suspensive/react-query via [NPM](https://www.npmjs.com/package/@suspensive/react-query).
 
 ```bash
-$ npm i @suspensive/react-query
-# or
-$ pnpm add @suspensive/react-query
-# or
-$ yarn add @suspensive/react-query
+npm i @suspensive/react-query
+```
+
+or
+
+```bash
+pnpm add @suspensive/react-query
+```
+
+or
+
+```bash
+yarn add @suspensive/react-query
 ```
 
 ### Motivation

diff --git a/docs/framework/react/devtools.md b/docs/framework/react/devtools.md
@@ -18,11 +18,19 @@ The devtools are a separate package that you need to install.
 The major version of all the packages must be in sync.
 
 ```bash
-$ npm i @tanstack/react-query-devtools@4
-# or
-$ pnpm add @tanstack/react-query-devtools@4
-# or
-$ yarn add @tanstack/react-query-devtools@4
+npm i @tanstack/react-query-devtools@4
+```
+
+or
+
+```bash
+pnpm add @tanstack/react-query-devtools@4
+```
+
+or
+
+```bash
+yarn add @tanstack/react-query-devtools@4
 ```
 
 You can import the devtools like this:

diff --git a/docs/framework/react/installation.md b/docs/framework/react/installation.md
@@ -10,11 +10,19 @@ or a good ol' `<script>` via
 ### NPM
 
 ```bash
-$ npm i @tanstack/react-query
-# or
-$ pnpm add @tanstack/react-query
-# or
-$ yarn add @tanstack/react-query
+npm i @tanstack/react-query@4
+```
+
+or
+
+```bash
+pnpm add @tanstack/react-query@4
+```
+
+or
+
+```bash
+yarn add @tanstack/react-query@4
 ```
 
 React Query is compatible with React v16.8+ and works with ReactDOM and React Native.
@@ -53,9 +61,17 @@ Opera >= 53
 It is recommended to also use our [ESLint Plugin Query](../../../eslint/eslint-plugin-query) to help you catch bugs and inconsistencies while you code. You can install it via:
 
 ```bash
-$ npm i -D @tanstack/eslint-plugin-query
-# or
-$ pnpm add -D @tanstack/eslint-plugin-query
-# or
-$ yarn add -D @tanstack/eslint-plugin-query
+npm i -D @tanstack/eslint-plugin-query@4
+```
+
+or
+
+```bash
+pnpm add -D @tanstack/eslint-plugin-query@4
+```
+
+or
+
+```bash
+yarn add -D @tanstack/eslint-plugin-query@4
 ```
diff --git a/docs/framework/svelte/installation.md b/docs/framework/svelte/installation.md
@@ -8,11 +8,19 @@ You can install Svelte Query via [NPM](https://npmjs.com).
 ### NPM
 
 ```bash
-$ npm i @tanstack/svelte-query
-# or
-$ pnpm add @tanstack/svelte-query
-# or
-$ yarn add @tanstack/svelte-query
+npm i @tanstack/svelte-query
+```
+
+or
+
+```bash
+pnpm add @tanstack/svelte-query
+```
+
+or
+
+```bash
+yarn add @tanstack/svelte-query
 ```
 
 > Wanna give it a spin before you download? Try out the [basic](../examples/basic) example!
diff --git a/docs/framework/vue/installation.md b/docs/framework/vue/installation.md
@@ -8,11 +8,19 @@ You can install Vue Query via [NPM](https://npmjs.com).
 ### NPM
 
 ```bash
-$ npm i @tanstack/vue-query
-# or
-$ pnpm add @tanstack/vue-query
-# or
-$ yarn add @tanstack/vue-query
+npm i @tanstack/vue-query
+```
+
+or
+
+```bash
+pnpm add @tanstack/vue-query
+```
+
+or
+
+```bash
+yarn add @tanstack/vue-query
 ```
 
 > Wanna give it a spin before you download? Try out the [basic](../examples/basic) example!

diff --git a/packages/vue-query/README.md b/packages/vue-query/README.md
@@ -35,11 +35,19 @@ Visit https://tanstack.com/query/v4/docs/adapters/vue-query
 1. Install `vue-query`
 
    ```bash
-   $ npm i @tanstack/vue-query
-   # or
-   $ pnpm add @tanstack/vue-query
-   # or
-   $ yarn add @tanstack/vue-query
+   npm i @tanstack/vue-query
+   ```
+
+   or
+
+   ```bash
+     pnpm add @tanstack/vue-query
+   ```
+
+   or
+
+   ```bash
+     yarn add @tanstack/vue-query
    ```
 
    > If you are using Vue 2.6, make sure to also setup [@vue/composition-api](https://github.com/vuejs/composition-api)