docs: add install

i7eo · Dec 8, 2023 · 96b551d · 96b551d
1 parent d0576da
commit 96b551d
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 13 deletions.
diff --git a/apps/docs/index.md b/apps/docs/index.md
@@ -32,15 +32,35 @@ trigger="click"
 @select="handleGoogleTranslateSelect"
 />
 
+### Install
+
 ::: code-group
 
-```vue{2-8,14-16} [vue2]
+```bash [vue2]
+pnpm add @google-translate-select/vue2
+# yarn add @google-translate-select/vue2
+# npm install @google-translate-select/vue2
+```
 
-npm install @google-translate-select/vue2
+```bash [vue3]
+pnpm add @google-translate-select/vue3
+# yarn add @google-translate-select/vue3
+# npm install @google-translate-select/vue3
+```
 
-import GoogleTranslateSelect from '@google-translate-select/vue2';
+```bash [react]
+pnpm add @google-translate-select/react
+# yarn add @google-translate-select/react
+# npm install @google-translate-select/react
+```
+
+:::
 
+### Usage
+
+::: code-group
 
+```vue{2-8,14-16} [vue2]
 <template>
   <GoogleTranslateSelect
     default-language-code="en"
@@ -51,7 +71,9 @@ import GoogleTranslateSelect from '@google-translate-select/vue2';
   />
 </template>
 <script lang="ts">
-import Vue from 'vue'
+import Vue from 'vue';
+import GoogleTranslateSelect from '@google-translate-select/vue2';
+
 export default Vue.extend({
   methods: {
     handleGoogleTranslateSelect(language) {
@@ -63,11 +85,6 @@ export default Vue.extend({
 ```
 
 ```vue{2-8,11-13} [vue3]
-
-npm install @google-translate-select/vue3
-
-import GoogleTranslateSelect from '@google-translate-select/vue3';
-
 <template>
   <GoogleTranslateSelect
     default-language-code="en"
@@ -78,15 +95,15 @@ import GoogleTranslateSelect from '@google-translate-select/vue3';
   />
 </template>
 <script setup lang="ts">
+import GoogleTranslateSelect from '@google-translate-select/vue3';
+
 const handleGoogleTranslateSelect = (language: any) => {
   console.log(language)
 }
 </script>
 ```
 
 ```tsx{2-5,7-13} [react]
-npm install @google-translate-select/vue3
-
 import GoogleTranslateSelect from '@google-translate-select/vue3';
 
 function App() {

diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -37,8 +37,8 @@
   },
   "scripts": {
     "dev": "vitepress dev .",
-    "build": "NODE_ENV=production && vitepress build .",
-    "serve": "NODE_ENV=production vitepress serve . --port 5001"
+    "build": "vitepress build .",
+    "serve": "vitepress serve . --port 5001"
   },
   "dependencies": {
     "@google-translate-select/constants": "workspace:*",