Add new installing docs

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<ConfigSchema>['bundleConfig'];
@@ -92,15 +92,15 @@ nodecg.Replicant<string>('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<string>('test-replicant');
 }
 ```
 
 ```typescript title="index.ts"
-import type NodeCG from '@nodecg/types';
+import type NodeCG from 'nodecg/types';
 
 import { test } from "./example";
 

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<ExampleReplicant>('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,15 +41,15 @@ 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"]
 }
 ```
 
 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', () => {
     // ...
 })

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}
 

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.

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',