mirror of
https://github.com/Pandipipas/scoreko-dev.git
synced 2026-06-05 19:22:07 +00:00
Initial commit
This commit is contained in:
Pandipipas
+136
@@ -0,0 +1,136 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
lerna-debug.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
*.lcov
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Snowpack dependency directory (https://snowpack.dev/)
|
||||
web_modules/
|
||||
|
||||
# TypeScript cache
|
||||
*.tsbuildinfo
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional stylelint cache
|
||||
.stylelintcache
|
||||
|
||||
# Microbundle cache
|
||||
.rpt2_cache/
|
||||
.rts2_cache_cjs/
|
||||
.rts2_cache_es/
|
||||
.rts2_cache_umd/
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variable files
|
||||
.env
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.env.local
|
||||
|
||||
# parcel-bundler cache (https://parceljs.org/)
|
||||
.cache
|
||||
.parcel-cache
|
||||
|
||||
# Next.js build output
|
||||
.next
|
||||
out
|
||||
|
||||
# Nuxt.js build / generate output
|
||||
.nuxt
|
||||
dist
|
||||
|
||||
# Gatsby files
|
||||
.cache/
|
||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||
# public
|
||||
|
||||
# vuepress build output
|
||||
.vuepress/dist
|
||||
|
||||
# vuepress v2.x temp and cache directory
|
||||
.temp
|
||||
.cache
|
||||
|
||||
# Docusaurus cache and generated files
|
||||
.docusaurus
|
||||
|
||||
# Serverless directories
|
||||
.serverless/
|
||||
|
||||
# FuseBox cache
|
||||
.fusebox/
|
||||
|
||||
# DynamoDB Local files
|
||||
.dynamodb/
|
||||
|
||||
# TernJS port file
|
||||
.tern-port
|
||||
|
||||
# Stores VSCode versions used for testing VSCode extensions
|
||||
.vscode-test
|
||||
|
||||
# yarn v2
|
||||
.yarn/cache
|
||||
.yarn/unplugged
|
||||
.yarn/build-state.yml
|
||||
.yarn/install-state.gz
|
||||
.pnp.*
|
||||
|
||||
# NodeCG built files
|
||||
/dashboard/
|
||||
/extension/
|
||||
/graphics/
|
||||
/shared/dist/
|
||||
Vendored
+7
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"recommendations": [
|
||||
"dbaeumer.vscode-eslint",
|
||||
"syler.sass-indented",
|
||||
"Vue.volar",
|
||||
]
|
||||
}
|
||||
Vendored
+13
@@ -0,0 +1,13 @@
|
||||
{
|
||||
"explorer.fileNesting.enabled": true,
|
||||
"explorer.fileNesting.expand": false,
|
||||
"explorer.fileNesting.patterns": {
|
||||
"eslint.config.js": "eslint.*.js",
|
||||
},
|
||||
"editor.tabSize": 2,
|
||||
"files.eol": "\n",
|
||||
"editor.codeActionsOnSave": {
|
||||
"source.organizeImports": "explicit"
|
||||
},
|
||||
"typescript.tsdk": "node_modules\\typescript\\lib",
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2025 zoton2
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
@@ -0,0 +1,76 @@
|
||||
# nodecg-vue-ts-template
|
||||
|
||||
Template for NodeCG bundles that use Vue.js and TypeScript.
|
||||
|
||||
|
||||
## Technical Details
|
||||
|
||||
- Tested with Node.js v22.11.0 and above (as of writing, latest LTS properly tested and supported with NodeCG).
|
||||
- Extension uses TypeScript.
|
||||
- Browser uses Vue.js (v3), with TypeScript for the scripting.
|
||||
- Includes the [nodecg-vue-composable](https://github.com/Dan-Shields/nodecg-vue-composable) helper composable to help with using replicants; I advise you check it's README for more information.
|
||||
- Dashboard also includes Quasar, for easy styling of UI.
|
||||
- If you wish to configure Quasar differently, check [the quasar vite-plugin documentation](https://quasar.dev/start/vite-plugin#using-quasar).
|
||||
- Builds using Vite, using the [vite-plugin-nodecg](https://github.com/nodecg/vite-plugin-nodecg) plugin.
|
||||
- The bundle also overrides `vite` to v6 (dependency asks for v5) as it is tested working.
|
||||
- ESLint is included for extension/browser/typings.
|
||||
- Extends some other recommended configurations.
|
||||
- I personally use Visual Studio Code with some appropriate extensions so have made sure it works well in that editor.
|
||||
- Includes a `.vscode/extensions.json` that will suggest you appropriate extensions.
|
||||
- Includes a `.vscode/settings.json` that has some settings that you may find useful.
|
||||
- The extension/browser files have some example code scattered about that should help in how to use things.
|
||||
|
||||
## Limitations
|
||||
|
||||
- I don't use any JSON schema specs higher than `draft-07` due to Visual Studio Code not supporting them correctly; see [this issue](https://github.com/microsoft/vscode/issues/98724).
|
||||
|
||||
## Package Commands
|
||||
|
||||
- `autofix`: Automatically fix any possible linting errors using ESLint.
|
||||
- `prebuild`: Clean up all built/watched files; will automatically run before `build` if called.
|
||||
- `build`: Build written code for use in production.
|
||||
- `clean`: Clean up all built/watched files.
|
||||
- `lint`: Finds any possible linting errors using ESLint, but does not fix them.
|
||||
- `schema-types`: Create TypeScript typings for schemas/`Configschema.json` using `nodecg` CLI.
|
||||
- `start`: Start NodeCG.
|
||||
- `watch`: Build code and watch for changes, for use in development.
|
||||
|
||||
## Changelogs
|
||||
|
||||
All changes onwards from v3.0.0 are available on the [releases](../../releases) section. Other changelogs are available below.
|
||||
|
||||
### Differences between template v2 and v3...
|
||||
|
||||
This is a "brief" list of changes, although in relality it was mostly rewritten from the ground up, so there are probably more.
|
||||
|
||||
If you want to see all of the changes, check out the [original PR](https://github.com/zoton2/nodecg-vue-ts-template/pull/24).
|
||||
|
||||
- Switched Vite config file to TypeScript (`vite.config.mjs` > `vite.config.ts`).
|
||||
- Updated how the extension code is built and how it is run in a Node.js context:
|
||||
- It now runs using the `module` type.
|
||||
- It is built targetting more modern standards (based on `@tsconfig/node22`).
|
||||
- All updates needed for NodeCG v2, which isn't too many but is still some (mainly type related).
|
||||
- Bumped `package.json`s `nodecg.compatibleRange` to `^2.3.0`, as that's the first NodeCG version that properly supported Node.js v22.11.0 LTS.
|
||||
- Use NodeCG types from official dependency.
|
||||
- Replaced [@vueuse/head](https://github.com/vueuse/head) with [@unhead/vue](https://github.com/unjs/unhead), due to the former's sunsetting.
|
||||
- ESLint overhaul:
|
||||
- Upgraded from ESLint v9 from v8.
|
||||
- Switched to using flat configs.
|
||||
- A lot was stripped out that I don't think was needed (feel free to report any issues you may have).
|
||||
- No longer extends the configuration from airbnb-typescript, as it isn't available for ESLint v9 yet, and I wanted to try without it.
|
||||
- Reduced the amount of `package.json` scripts/commands by combining some of them and removing the extension/browser/etc. splits.
|
||||
- Added a `./src/browser_shared` folder with a shared `replicant.ts` helper file for browser contexts.
|
||||
- Removed MDI CSS being imported by default on dashboard panels.
|
||||
- Removed the `module-alias` parts as I felt they may have made things too confusing.
|
||||
- Moved browser `*.ts` entry files into the the respective sub-directories for better organisation.
|
||||
|
||||
### Differences between template v1 and v2...
|
||||
|
||||
- Upgraded Vue to v3 from v2.
|
||||
- Uses Vite to build browser code instead of Webpack.
|
||||
- Uses Quasar for material design styling help instead of Vuetify.
|
||||
- No TypeScript decorators used in the browser code now as they aren't needed.
|
||||
- Adds [nodecg-vue-composable](https://github.com/Dan-Shields/nodecg-vue-composable) to help with using/modifying replicants in browser.
|
||||
- No longer includes any Vue state plugins by default (as no longer needed for replicants), but you can add one if needed (I'd suggest [pinia](https://pinia.vuejs.org/)).
|
||||
- Includes [@vueuse/head](https://github.com/vueuse/head), in the example code just used to help change the title of each page.
|
||||
- Uses the [nodecg-types](https://github.com/codeoverflow-org/nodecg-types) package instead of directly referencing the installed NodeCG instance.
|
||||
@@ -0,0 +1,13 @@
|
||||
{
|
||||
"$schema": "http://json-schema.org/draft-07/schema#",
|
||||
"type": "object",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"exampleProperty": {
|
||||
"type": "string"
|
||||
}
|
||||
},
|
||||
"required": [
|
||||
"exampleProperty"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
// @ts-check
|
||||
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript';
|
||||
import pluginVue from 'eslint-plugin-vue';
|
||||
import tseslint from 'typescript-eslint';
|
||||
|
||||
/* Rules used for anything browser related (dashboard and graphics). */
|
||||
export default tseslint.config({
|
||||
extends: defineConfigWithVueTs(
|
||||
pluginVue.configs['flat/recommended'],
|
||||
vueTsConfigs.recommended,
|
||||
),
|
||||
rules: {
|
||||
// Allows "main.vue" files to be named as such.
|
||||
'vue/multi-word-component-names': ['error', { ignores: ['main'] }],
|
||||
},
|
||||
files: [
|
||||
'src/browser_shared/**/*.ts',
|
||||
'src/browser_shared/**/*.vue',
|
||||
'src/dashboard/**/*.ts',
|
||||
'src/dashboard/**/*.vue',
|
||||
'src/graphics/**/*.ts',
|
||||
'src/graphics/**/*.vue',
|
||||
],
|
||||
});
|
||||
@@ -0,0 +1,19 @@
|
||||
// @ts-check
|
||||
import tseslint from 'typescript-eslint';
|
||||
import browser from './eslint.browser.js';
|
||||
import extension from './eslint.extension.js';
|
||||
|
||||
/* Exists so anything looking for an ESLint config file (including VSCode and the `eslint` command) can find the rules. */
|
||||
export default tseslint.config([
|
||||
{
|
||||
ignores: [
|
||||
// Ignore built files.
|
||||
'dashboard/**/*',
|
||||
'extension/**/*',
|
||||
'graphics/**/*',
|
||||
'shared/dist/**/*',
|
||||
],
|
||||
},
|
||||
browser,
|
||||
extension,
|
||||
]);
|
||||
@@ -0,0 +1,19 @@
|
||||
// @ts-check
|
||||
import eslint from '@eslint/js';
|
||||
import tseslint from 'typescript-eslint';
|
||||
|
||||
/* Rules used for anything extension related (including types). */
|
||||
export default tseslint.config({
|
||||
extends: [
|
||||
eslint.configs.recommended,
|
||||
tseslint.configs.recommended,
|
||||
],
|
||||
files: [
|
||||
'src/extension/**/*.ts',
|
||||
'src/types/**/*.d.ts',
|
||||
],
|
||||
ignores: [
|
||||
'src/types/schemas/**/*.d.ts',
|
||||
'src/types/env.d.ts',
|
||||
],
|
||||
});
|
||||
Generated
+12205
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,79 @@
|
||||
{
|
||||
"name": "nodecg-vue-ts-template",
|
||||
"version": "3.0.0",
|
||||
"description": "Template for NodeCG bundles that use Vue.js and TypeScript.",
|
||||
"homepage": "https://github.com/zoton2/nodecg-vue-ts-template#readme",
|
||||
"bugs": {
|
||||
"url": "https://github.com/zoton2/nodecg-vue-ts-template/issues"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/zoton2/nodecg-vue-ts-template.git"
|
||||
},
|
||||
"license": "MIT",
|
||||
"author": "zoton2",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"autofix": "eslint --fix",
|
||||
"prebuild": "trash ./extension && trash ./node_modules/.vite && trash ./shared/dist && trash ./dashboard && trash ./graphics",
|
||||
"build": "vite build && tsc -b tsconfig.extension.json",
|
||||
"lint": "eslint",
|
||||
"schema-types": "nodecg schema-types",
|
||||
"start": "cd ../.. && node index.js",
|
||||
"watch": "conc -n B,E -c red,blue -k vite \"tsc -b -w --preserveWatchOutput tsconfig.extension.json\""
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.39.0",
|
||||
"@quasar/extras": "^1.17.0",
|
||||
"@quasar/vite-plugin": "^1.10.0",
|
||||
"@tsconfig/node22": "^22.0.2",
|
||||
"@types/node": "^22.18.13",
|
||||
"@unhead/vue": "^2.0.19",
|
||||
"@vitejs/plugin-vue": "^6.0.1",
|
||||
"@vue/eslint-config-typescript": "^14.6.0",
|
||||
"@vue/tsconfig": "^0.8.1",
|
||||
"concurrently": "^9.2.1",
|
||||
"eslint": "^9.39.0",
|
||||
"eslint-plugin-vue": "^10.5.1",
|
||||
"nodecg": "^2.6.1",
|
||||
"nodecg-vue-composable": "^1.1.0",
|
||||
"quasar": "^2.18.5",
|
||||
"sass-embedded": "^1.93.3",
|
||||
"trash-cli": "^7.0.0",
|
||||
"typescript": "^5.9.3",
|
||||
"typescript-eslint": "^8.46.2",
|
||||
"vite": "^7.1.12",
|
||||
"vite-plugin-checker": "^0.11.0",
|
||||
"vite-plugin-nodecg": "^2.1.0",
|
||||
"vue": "^3.5.22",
|
||||
"vue-tsc": "^3.1.2"
|
||||
},
|
||||
"pnpm": {
|
||||
"overrides": {
|
||||
"vite-plugin-nodecg>vite": "$vite"
|
||||
}
|
||||
},
|
||||
"nodecg": {
|
||||
"compatibleRange": "^2.3.0",
|
||||
"dashboardPanels": [
|
||||
{
|
||||
"name": "example",
|
||||
"title": "Example",
|
||||
"file": "example/main.html",
|
||||
"width": 3
|
||||
}
|
||||
],
|
||||
"graphics": [
|
||||
{
|
||||
"file": "example/main.html",
|
||||
"width": 1920,
|
||||
"height": 1080
|
||||
}
|
||||
]
|
||||
},
|
||||
"overrides": {
|
||||
"vite-plugin-nodecg": {
|
||||
"vite": "$vite"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
{
|
||||
"$schema": "http://json-schema.org/draft-07/schema#",
|
||||
"type": "object",
|
||||
"additionalProperties": false,
|
||||
"properties": {
|
||||
"exampleProperty": {
|
||||
"type": "string",
|
||||
"default": "exampleString"
|
||||
}
|
||||
},
|
||||
"required": [
|
||||
"exampleProperty"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
import { useReplicant } from 'nodecg-vue-composable';
|
||||
import type { Schemas } from '../types';
|
||||
|
||||
// YOU MUST CHANGE THIS TO YOUR BUNDLE'S NAME!
|
||||
const thisBundle = 'nodecg-vue-ts-template';
|
||||
|
||||
/**
|
||||
* This is where you can declare all of your replicants to import easily into other (browser based) files.
|
||||
* "useReplicant" is a helper composable to make accessing/modifying replicants easier.
|
||||
* For more information see https://github.com/Dan-Shields/nodecg-vue-composable
|
||||
*/
|
||||
export const exampleReplicant = useReplicant<Schemas.ExampleReplicant>('exampleReplicant', thisBundle);
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
@@ -0,0 +1,14 @@
|
||||
import '@quasar/extras/material-icons/material-icons.css';
|
||||
import '@quasar/extras/roboto-font/roboto-font.css';
|
||||
import { createHead } from '@unhead/vue/client';
|
||||
import { Dark, Quasar } from 'quasar';
|
||||
import 'quasar/src/css/index.sass';
|
||||
import { createApp } from 'vue';
|
||||
import App from './main.vue';
|
||||
|
||||
const app = createApp(App);
|
||||
const head = createHead();
|
||||
app.use(Quasar);
|
||||
app.use(head);
|
||||
app.mount('#app');
|
||||
Dark.set(true);
|
||||
@@ -0,0 +1,32 @@
|
||||
<script setup lang="ts">
|
||||
import { useHead } from '@unhead/vue';
|
||||
import { ref } from 'vue';
|
||||
import { exampleReplicant } from '../../browser_shared/replicants';
|
||||
import type { ExampleType } from '../../types';
|
||||
|
||||
useHead({ title: 'example' }); // set the title of this page
|
||||
const text = ref('Example');
|
||||
|
||||
// Example code: accessing normal types.
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const exampleType: ExampleType = { exampleProperty: 'exampleString' };
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
{{ text }}
|
||||
<br><br>
|
||||
<img
|
||||
src="./image.png"
|
||||
:style="{ width: '100%' }"
|
||||
>
|
||||
<br><br>
|
||||
<QBtn
|
||||
color="primary"
|
||||
label="Example"
|
||||
/>
|
||||
<br><br>
|
||||
<!-- Example code: accessing a replicant. -->
|
||||
{{ exampleReplicant?.data?.exampleProperty }}
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,11 @@
|
||||
$primary : #00BEBE // NodeCG primary colour
|
||||
$secondary : #26A69A
|
||||
$accent : #9C27B0
|
||||
|
||||
$dark : #1D1D1D
|
||||
$dark-page : #121212
|
||||
|
||||
$positive : #21BA45
|
||||
$negative : #C10015
|
||||
$info : #31CCEC
|
||||
$warning : #F2C037
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
body {
|
||||
background-color: #2F3A4F !important; /* force body background to original NodeCG colour */
|
||||
margin: 15px !important; /* force body to have original NodeCG padding */
|
||||
width: unset !important; /* unset quasar width */
|
||||
min-width: unset !important; /* unset quasar min-width */
|
||||
font-size: unset !important; /* unset quasar font-size */
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,15 @@
|
||||
import type { ExampleType } from '../types/index.js';
|
||||
import { nodecg } from './util/nodecg.js';
|
||||
import { exampleReplicant } from './util/replicants.js';
|
||||
|
||||
// Example code:
|
||||
// Log to show things are working.
|
||||
nodecg.log.info('Extension code working!');
|
||||
// Access this bundle's configuration with no type assertion needed.
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const configProperty = nodecg.bundleConfig.exampleProperty;
|
||||
// Access/set a replicant (also see ./util/replicants).
|
||||
exampleReplicant.value = { exampleProperty: `exampleString_Changed_${Date.now()}` };
|
||||
// Accessing normal types.
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const exampleType: ExampleType = { exampleProperty: 'exampleString' };
|
||||
@@ -0,0 +1,12 @@
|
||||
import type { NodeCGServerAPI } from '../types/index.js';
|
||||
import { set } from './util/nodecg.js';
|
||||
|
||||
export default async (nodecg: NodeCGServerAPI) => {
|
||||
/**
|
||||
* Because of how top-level `import`s work, it helps to use `import`s here
|
||||
* to force things to be loaded *after* the NodeCG context is set.
|
||||
*/
|
||||
set(nodecg); // set nodecg "context" before anything else
|
||||
await import('./util/replicants.js'); // make sure replicants are set up
|
||||
await import('./example.js');
|
||||
};
|
||||
@@ -0,0 +1,7 @@
|
||||
import type { NodeCGServerAPI } from '../../types/index.js';
|
||||
|
||||
export let nodecg!: NodeCGServerAPI;
|
||||
|
||||
export function set(ctx: NodeCGServerAPI) {
|
||||
nodecg = ctx;
|
||||
}
|
||||
@@ -0,0 +1,19 @@
|
||||
import type NodeCG from 'nodecg/types';
|
||||
import type { Schemas } from '../../types/index.js';
|
||||
import { nodecg } from './nodecg.js';
|
||||
|
||||
// Wrapper for replicants that have a default (based on schema).
|
||||
function hasDefault<T>(name: string) {
|
||||
return nodecg.Replicant<T>(name) as unknown as NodeCG.default.ServerReplicantWithSchemaDefault<T>;
|
||||
}
|
||||
// Wrapper for replicants that don't have a default (based on schema).
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
function hasNoDefault<T>(name: string) {
|
||||
return nodecg.Replicant<T>(name) as NodeCG.default.ServerReplicant<T>;
|
||||
}
|
||||
|
||||
/**
|
||||
* This is where you can declare all of your replicants to import easily into other files,
|
||||
* and to make sure they have any correct settings on startup.
|
||||
*/
|
||||
export const exampleReplicant = hasDefault<Schemas.ExampleReplicant>('exampleReplicant');
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
@@ -0,0 +1,8 @@
|
||||
import { createHead } from '@unhead/vue/client';
|
||||
import { createApp } from 'vue';
|
||||
import App from './main.vue';
|
||||
|
||||
const app = createApp(App);
|
||||
const head = createHead();
|
||||
app.use(head);
|
||||
app.mount('#app');
|
||||
@@ -0,0 +1,24 @@
|
||||
<script setup lang="ts">
|
||||
import { useHead } from '@unhead/vue';
|
||||
import { ref } from 'vue';
|
||||
import { exampleReplicant } from '../../browser_shared/replicants';
|
||||
import type { ExampleType } from '../../types';
|
||||
|
||||
useHead({ title: 'example' }); // set the title of this page
|
||||
const text = ref('Example');
|
||||
|
||||
// Example code: accessing normal types.
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const exampleType: ExampleType = { exampleProperty: 'exampleString' };
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
{{ text }}
|
||||
<br><br>
|
||||
<img src="./image.png">
|
||||
<br><br>
|
||||
<!-- Example code: accessing a replicant. -->
|
||||
{{ exampleReplicant?.data?.exampleProperty }}
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,9 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
Vendored
+3
@@ -0,0 +1,3 @@
|
||||
export interface ExampleType {
|
||||
exampleProperty: string;
|
||||
}
|
||||
Vendored
+12
@@ -0,0 +1,12 @@
|
||||
/**
|
||||
* This is a modified version of the augment-window.d.ts file included in
|
||||
* the NodeCG types, but allows us to automatically receive the configuration types.
|
||||
*/
|
||||
|
||||
import type { NodeCGAPIClient } from '../../node_modules/nodecg/out/client/api/api.client.d.ts';
|
||||
import type { Configschema } from './schemas/configschema.d.ts';
|
||||
|
||||
declare global {
|
||||
let NodeCG: typeof NodeCGAPIClient;
|
||||
let nodecg: NodeCGAPIClient<Configschema>;
|
||||
}
|
||||
Vendored
+6
@@ -0,0 +1,6 @@
|
||||
import type NodeCG from 'nodecg/types';
|
||||
import type { Configschema } from './schemas.d.ts';
|
||||
|
||||
export type NodeCGServerAPI = NodeCG.default.ServerAPI<Configschema>;
|
||||
export type { ExampleType } from './ExampleType.d.ts';
|
||||
export type * as Schemas from './schemas.d.ts';
|
||||
Vendored
+8
@@ -0,0 +1,8 @@
|
||||
/**
|
||||
* This is a file where the schema types can be re-exported properly.
|
||||
* This is for convenience; nothing is different if referenced from their files directly.
|
||||
* Also see index.d.ts for a "grouped" re-export of this as well.
|
||||
*/
|
||||
|
||||
export type { Configschema } from './schemas/configschema.d.ts';
|
||||
export type { ExampleReplicant } from './schemas/exampleReplicant.d.ts';
|
||||
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
/* prettier-ignore */
|
||||
/* eslint-disable */
|
||||
/**
|
||||
* This file was automatically generated by json-schema-to-typescript.
|
||||
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
||||
* and run json-schema-to-typescript to regenerate this file.
|
||||
*/
|
||||
|
||||
export interface Configschema {
|
||||
exampleProperty: string;
|
||||
}
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
/* prettier-ignore */
|
||||
/* eslint-disable */
|
||||
/**
|
||||
* This file was automatically generated by json-schema-to-typescript.
|
||||
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
||||
* and run json-schema-to-typescript to regenerate this file.
|
||||
*/
|
||||
|
||||
export interface ExampleReplicant {
|
||||
exampleProperty: string;
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
/* Settings here partially mimick those included in a generated Vue project (npm create vue). */
|
||||
/* Settings used for anything browser related (dashboard and graphics). */
|
||||
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||
"compilerOptions": {
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.browser.tsbuildinfo",
|
||||
},
|
||||
"include": [
|
||||
"./src/browser_shared/**/*.ts",
|
||||
"./src/browser_shared/**/*.vue",
|
||||
"./src/dashboard/**/*.ts",
|
||||
"./src/dashboard/**/*.vue",
|
||||
"./src/graphics/**/*.ts",
|
||||
"./src/graphics/**/*.vue",
|
||||
"./src/types/**/*.d.ts"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
/* Settings used for anything extension related. */
|
||||
"extends": "@tsconfig/node22/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.extension.tsbuildinfo",
|
||||
"rootDir": "./src/extension",
|
||||
"outDir": "./extension",
|
||||
"verbatimModuleSyntax": true,
|
||||
},
|
||||
"include": [
|
||||
"./src/extension/**/*.ts",
|
||||
"./src/types/**/*.d.ts"
|
||||
],
|
||||
"exclude": [
|
||||
"./src/types/augment-window.d.ts"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
/* Exists so anything looking for a tsconfig file (including VSCode) can find the settings. */
|
||||
"files": [],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.browser.json"
|
||||
},
|
||||
{
|
||||
"path": "./tsconfig.extension.json"
|
||||
},
|
||||
{
|
||||
"path": "./tsconfig.vite.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
/* Settings here mimick those included in a generated Vue project (npm create vue). */
|
||||
/* They are only used for the vite.config.ts file. */
|
||||
"extends": "@tsconfig/node22/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"noEmit": true,
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.vite.tsbuildinfo",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"types": [
|
||||
"node"
|
||||
]
|
||||
},
|
||||
"include": [
|
||||
"./vite.config.ts"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
import { quasar, transformAssetUrls } from '@quasar/vite-plugin';
|
||||
import vue from '@vitejs/plugin-vue';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
import { defineConfig } from 'vite';
|
||||
import checker from 'vite-plugin-checker';
|
||||
import NodeCGPlugin from 'vite-plugin-nodecg';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue({ template: { transformAssetUrls } }),
|
||||
quasar({
|
||||
autoImportComponentCase: 'pascal',
|
||||
sassVariables: fileURLToPath(
|
||||
new URL('./src/dashboard/quasar-variables.sass', import.meta.url)
|
||||
)
|
||||
}),
|
||||
checker({ vueTsc: { tsconfigPath: 'tsconfig.browser.json' } }),
|
||||
NodeCGPlugin({
|
||||
inputs: {
|
||||
'graphics/*/main.ts': './src/graphics/template.html',
|
||||
'dashboard/*/main.ts': './src/dashboard/template.html',
|
||||
},
|
||||
}),
|
||||
],
|
||||
});
|
||||
Reference in New Issue
Block a user