diff --git a/docs/extensions.md b/docs/extensions.md index 9e4c4ce4..6c9970f9 100644 --- a/docs/extensions.md +++ b/docs/extensions.md @@ -44,7 +44,7 @@ To make programming easier we split different functionality into different files ### Utility script ```typescript title="nodecg-api-context.ts" -import type NodeCG from '@nodecg/types'; +import type NodeCG from 'nodecg/types'; let context: NodeCG.ServerAPI; @@ -58,7 +58,7 @@ export function set(ctx: NodeCG.ServerAPI) { ``` ```typescript title="index.ts" -import type NodeCG from '@nodecg/types'; +import type NodeCG from 'nodecg/types'; import * as nodecgApiContext from './nodecg-api-context'; let ncgConfig: NodeCG.ServerAPI['bundleConfig']; @@ -92,7 +92,7 @@ nodecg.Replicant('test-replicant'); ### Have each extension export a function to call ```typescript title="example.ts" -import type NodeCG from '@nodecg/types'; +import type NodeCG from 'nodecg/types'; export const test = (nodecg: NodeCG) => { nodecg.Replicant('test-replicant'); @@ -100,7 +100,7 @@ export const test = (nodecg: NodeCG) => { ``` ```typescript title="index.ts" -import type NodeCG from '@nodecg/types'; +import type NodeCG from 'nodecg/types'; import { test } from "./example"; diff --git a/docs/frameworks/typescript.md b/docs/frameworks/typescript.md index 8721a7ca..872e1b5b 100644 --- a/docs/frameworks/typescript.md +++ b/docs/frameworks/typescript.md @@ -12,8 +12,6 @@ Install TypeScript as your bundle's dev dependency. ```bash npm install -D typescript -# or -yarn add -D typescript ``` ## Typing Replicants {#typing-replicants} @@ -31,12 +29,10 @@ const rep = nodecg.Replicant('example_replicant'); ## Using Type Definitions {#type-definitions} -To use NodeCG's type definitions, you'll need to first install them, as they are distributed as a separate package to keep things light and portable: +If you have not installed `nodecg` in your project: ```bash -npm install -D @nodecg/types -# or -yarn add -D @nodecg/types +npm install -D nodecg ``` The majority of the types are used by importing the types package and referencing the types that way, but to access the browser globals (`window.nodecg` and `window.NodeCG`), an extra step is required. You'll need to modify your bundle's `tsconfig.json` files(s) in one of two ways achieve this: @@ -45,7 +41,7 @@ The first approach is to use [`include`](https://www.typescriptlang.org/tsconfig ```json { - "include": ["src/**/*.ts", "src/**/*.tsx", "node_modules/@nodecg/types/augment-window.d.ts"] + "include": ["src/**/*.ts", "src/**/*.tsx", "node_modules/nodecg/types/augment-window.d.ts"] } ``` @@ -53,7 +49,7 @@ If you use Vue, be sure to include your `*.vue` files as well: ```json { - "include": ["src/**/*.ts", "**/*.vue", "node_modules/@nodecg/types/augment-window.d.ts"] + "include": ["src/**/*.ts", "**/*.vue", "node_modules/nodecg/types/augment-window.d.ts"] } ``` @@ -62,7 +58,7 @@ The second approach is to use [`types`](https://www.typescriptlang.org/tsconfig# ```json { "compilerOptions": { - "types": ["node", "jest", "express", "@nodecg/types/augment-window"] + "types": ["node", "express", "nodecg/types/augment-window"] } } ``` @@ -72,7 +68,7 @@ Both of these approaches have pros and cons, so be sure to read their correspond ### extension {#extension} ```ts -import NodeCG from '@nodecg/types'; +import NodeCG from 'nodecg/types'; export = (nodecg: NodeCG.ServerAPI) => { nodecg.sendMessage('message'); @@ -83,7 +79,7 @@ export = (nodecg: NodeCG.ServerAPI) => { ```ts // Some types get automatically injected into the global scope by our tsconfig.json. -// For everything else, you can `import NodeCG from '@nodecg/types'` just as in our extension example. +// For everything else, you can `import NodeCG from 'nodecg/types'` just as in our extension example. nodecg.listenFor('message', () => { // ... }) diff --git a/docs/frameworks/using-bundlers.md b/docs/frameworks/using-bundlers.md index 469dadb5..e71ef1a8 100644 --- a/docs/frameworks/using-bundlers.md +++ b/docs/frameworks/using-bundlers.md @@ -97,23 +97,10 @@ missing packages for you if there is any. ```bash npm install --save-dev parcel-bundler -# or -yarn add -D parcel-bundler ``` The `parcel` command will be available locally. You can run it either adding -npm scripts, or `npx parcel`/`yarn parcel`. - -##### Globally {#parcel-add-global} - -```bash -npm install -g parcel-bundler -# or -yarn global add parcel-bundler -``` - -With this, `parcel` command should be available globally. Just run `parcel` to -run the bundler. +npm scripts, or `npx parcel` #### Make an entrypoint {#parcel-entrypoint} diff --git a/docs/installing.md b/docs/installing-legacy.md similarity index 100% rename from docs/installing.md rename to docs/installing-legacy.md diff --git a/docs/installing-new.md b/docs/installing-new.md new file mode 100644 index 00000000..e45adb69 --- /dev/null +++ b/docs/installing-new.md @@ -0,0 +1,46 @@ +--- +id: installing-new +title: Installing NodeCG (New, Experimental) +sidebar_label: Installing (New) +--- + +This guide is for the new experimental way of installing NodeCG. +In this new way, NodeCG is installed as a dependency of your project, +instead of including your project in the NodeCG's bundles directory. + +This simplifies the process of creating and managing NodeCG projects +by directly managing NodeCG version as an npm dependency. + +You can still use the old way of using NodeCG, but will be deprecated in the future. + +## Install {#install} + +```bash +npm install nodecg +``` + +## Start {#start} + +Run `npx nodecg start`. + +Open the dashboard (`http://localhost:9090` by default). + +## Using multiple bundles {#multi-bundle} + +You can use multiple bundles in your project by including it in `bundles` directory in your project root. + +## Migration from legacy structure {#migration} + +If you have an existing NodeCG projects that run inside NodeCG's bundles directory, +you can migrate to the new structure by following these steps: + +1. If you run multiple bundles, choose one of them to be the main project. +1. Move the main bundle as an independent project root. +1. Install NodeCG as a dependency of the main project by running `npm install nodecg`. +1. Move the other bundles to the `bundles` directory in the main project root. +1. Move the following directories from the previous NodeCG root: + - `cfg` + - `db` + - `logs` + - `assets` +1. Start NodeCG by running `npx nodecg start` in the main project root. diff --git a/sidebars.ts b/sidebars.ts index 17cc80d0..c08b3665 100644 --- a/sidebars.ts +++ b/sidebars.ts @@ -2,7 +2,7 @@ import type { SidebarsConfig } from '@docusaurus/plugin-content-docs'; const sidebars: SidebarsConfig = { mainSidebar: { - 'Quick Start': ['what-is-nodecg', 'installing', 'creating-bundles'], + 'Quick Start': ['what-is-nodecg', 'installing', 'installing-new', 'creating-bundles'], Guides: [ 'concepts-and-terminology', 'manifest',