feat: composable and plugin path aliases (#33)

* feat: composable and plugin path aliases

* fix: main.ts

docs/changelog.md

@@ -4,6 +4,18 @@ order: -5
 
 # Changelog
 
+## Version 16
+
+### Code Changes
+
+- Added `@Composables` path alias
+- Added `@Plugins` path alias
+
+### Docs Changes
+
+- Updated composables with `@Composables`
+- Updated `what is a plugin` with information about component / composable only plugins
+
 ## Version 15
 
 ### Code Changes

docs/plugins/what-is-a-plugin.md

@@ -12,6 +12,8 @@ Plugins can be found in the `src/plugins` directory, and each plugin should have
 
 ## Example Plugin Structure
 
+This plugin structure is used purely as a full featured plugin.
+
 ```
 ├───main
 │   ├───client
@@ -39,6 +41,22 @@ Plugins can be found in the `src/plugins` directory, and each plugin should have
 
 See [create a plugin](./create.md) for more information.
 
+## Example Shared Vue Components / Composables Plugin
+
+It is recommended to prefix your plugin with `ui` when it's components and composables
+
+```
+├───main
+│   ├───client
+│   ├───server
+│   ├───shared
+│   └───translate
+└───plugins
+    └───ui-your-plugin
+        └───UiInput.vue
+        └───UiButton.vue
+```
+
 ## Disabling Plugins
 
 If you wish to disable a plugin simply add a `!` before the folder name.

docs/webview/composables/use-audio.md

@@ -6,7 +6,7 @@ If you wish to play frontend sounds check out the [Frontend Sound List](../../da
 
 ```html
 <script lang="ts" setup>
-    import { useAudio } from '../../../../webview/composables/useAudio';
+    import { useAudio } from '@Composables/useAudio';
 
     const audio = useAudio();
 

docs/webview/composables/use-events.md

@@ -4,7 +4,7 @@ This is an event wrapper that allows for communication directly to the server, o
 
 ```html
 <script lang="ts" setup>
-    import { useEvents } from '../../../../webview/composables/useEvents';
+    import { useEvents } from '@Composables/useEvents';
 
     const events = useEvents();
 

docs/webview/composables/use-local-storage.md

@@ -3,7 +3,7 @@
 A way to store local data to the alt:V Client.
 
 ```ts
-import { useLocalStorage } from '../../../../webview/composables/useLocalStorage'
+import { useLocalStorage } from '@Composables/useLocalStorage'
 
 async function example() {
     const localStorage = useLocalStorage();

docs/webview/composables/use-messenger.md

@@ -4,7 +4,7 @@ Gives the ability to get `messages` from the messenger system as well as `emit m
 
 ```html
 <script lang="ts" setup>
-    import { useMessenger } from '../../../../webview/composables/useMessenger';
+    import { useMessenger } from '@Composables/useMessenger';
 
     const messenger = useMessenger();
 

docs/webview/composables/use-minimap.md

@@ -9,7 +9,7 @@ It will automatically update the minimap positional data when resolution is chan
 ```html
 <script lang="ts" setup>
     import { computed } from 'vue';
-    import { useMinimap } from '../../../../webview/composables/useMinimap';
+    import { useMinimap } from '@Composables/useMinimap';
 
     const { minimap } = useMinimap();
 

docs/webview/composables/use-player-stats.md

@@ -6,7 +6,7 @@ Here's an example of how to use it.
 
 ```html
 <script lang="ts" setup>
-    import { usePlayerStats } from '../../../../webview/composables/usePlayerStats';
+    import { usePlayerStats } from '@Composables/usePlayerStats';
 
     const {
         health,

package.json

@@ -1,7 +1,7 @@
 {
     "author": "stuyk",
     "type": "module",
-    "version": "15",
+    "version": "16",
     "scripts": {
         "dev": "nodemon -x pnpm start",
         "dev:linux": "nodemon -x pnpm start:linux",
@@ -65,7 +65,8 @@
             "*/package.json",
             "*.mjs",
             "ignore*.ts",
-            "autogen*.ts"
+            "autogen*.ts",
+            "webview/src/main.ts"
         ]
     }
 }

scripts/upgrade.js

@@ -8,8 +8,10 @@ const srcMainPath = path.resolve(process.cwd(), 'src/main');
 const webviewComposablesPath = path.resolve(process.cwd(), 'webview/composables');
 const webviewSrcPath = path.resolve(process.cwd(), 'webview/src');
 const webviewPublicPath = path.resolve(process.cwd(), 'webview/public');
+const viteConfigPath = path.resolve(process.cwd(), 'webview/vite.config.ts');
 const docsPath = path.resolve(process.cwd(), 'docs');
 const packagePath = path.resolve(process.cwd(), 'package.json');
+const tsConfigPath = path.resolve(process.cwd(), 'tsconfig.json');
 
 function cloneRepository(repoUrl, clonePath) {
     console.log(`Cloning repository from ${repoUrl} to ${clonePath}...`);
@@ -30,8 +32,10 @@ try {
     moveDirectory(path.join(tmpPath, 'webview/composables'), webviewComposablesPath);
     moveDirectory(path.join(tmpPath, 'webview/src'), webviewSrcPath);
     moveDirectory(path.join(tmpPath, 'webview/public'), webviewPublicPath);
+    moveDirectory(path.join(tmpPath, 'webview/vite.config.ts'), viteConfigPath);
     moveDirectory(path.join(tmpPath, 'docs'), docsPath);
     moveDirectory(path.join(tmpPath, 'package.json'), packagePath, false);
+    moveDirectory(path.join(tmpPath, 'tsconfig.json'), tsConfigPath, false);
     execSync(`pnpm upgrade`, { stdio: 'inherit' });
     execSync(`pnpm install`, { stdio: 'inherit' });
     fs.rmSync(tmpPath, { force: true, recursive: true });

src/main/client/menus/native/input.ts

@@ -61,3 +61,10 @@ export async function getInput(previousValue: string): Promise<string> {
         alt.on('keyup', handleKeyPress);
     });
 }
+
+alt.on('disconnect', () => {
+    if (document && document.valid) {
+        document.destroy();
+        document = undefined;
+    }
+})

tsconfig.json

@@ -4,7 +4,9 @@
         "paths": {
             "@Server/*": ["main/server/*"],
             "@Client/*": ["main/client/*"],
-            "@Shared/*": ["main/shared/*"]
+            "@Shared/*": ["main/shared/*"],
+            "@Plugins/*": ["plugins/*"],
+            "@Composables/*": ["../webview/composables/*"]
         },
         "typeRoots": ["./node_modules/@types", "./node_modules/@altv"],
         "removeComments": true,
@@ -30,15 +32,10 @@
     },
     "include": [
         "src/**/*.ts",
-        "src-webviews/**/*.ts",
-        "src-webviews/**/*.d.ts",
         "src/**/*.ts",
         "src/**/*.d.ts",
         "src/**/*.tsx",
         "src/**/*.vue",
-        "src/main/plugins/**/webview/**.ts",
-        "src/main/plugins/**/webview/**.vue",
-        "src/main/plugins/**/components/**.vue"
     ],
     "exclude": [
         "resources",

webview/vite.config.ts

@@ -15,6 +15,8 @@ export default defineConfig({
             '@Client': path.resolve(__dirname, '../src/main/client'),
             '@Server': path.resolve(__dirname, '../src/main/server'),
             '@Shared': path.resolve(__dirname, '../src/main/shared'),
+            '@Plugins': path.resolve(__dirname, '../src/plugins'),
+            '@Composables': path.resolve(__dirname, './composables')
         },
     },
     plugins: [vue()],