docs: v2_dev after upgrading from v1 to v2 (#7432)

docs/start/v2.md

@@ -7,6 +7,107 @@ order: 3
 
 All v2 APIs and behaviors are available in v1 with [Future Flags][future-flags]. They can be enabled one at a time to avoid development disruption of your project. After you have enabled all flags, upgrading to v2 should be a non-breaking upgrade.
 
+## `remix dev`
+
+For configuration options, see the [`remix dev` docs][v2-dev-config].
+
+### `remix-serve`
+
+If you are using the Remix App Server (`remix-serve`), enable `v2_dev`:
+
+```js filename=remix.config.js
+/** @type {import('@remix-run/dev').AppConfig} */
+module.exports = {
+  future: {
+    v2_dev: true,
+  },
+};
+```
+
+That's it!
+
+### Custom app server
+
+If you are using your own app server (`server.js`),
+then check out our [templates][templates] for examples of how to integrate with `v2_dev`
+or follow these steps:
+
+1. Enable `v2_dev`:
+
+```js filename=remix.config.js
+/** @type {import('@remix-run/dev').AppConfig} */
+module.exports = {
+  future: {
+    v2_dev: true,
+  },
+};
+```
+
+2. Update `scripts` in `package.json`:
+
+- Replace any `remix watch` with `remix dev`
+- Remove redundant `NODE_ENV=development`
+- Use `-c` / `--command` to run your app server
+
+For example:
+
+```diff filename=package.json
+{
+  "scripts": {
+-   "dev:remix": "cross-env NODE_ENV=development remix watch",
+-   "dev:server": "cross-env NODE_ENV=development node ./server.js"
++   "dev": "remix dev -c 'node ./server.js'",
+  }
+}
+```
+
+3. Send a "ready" message to the Remix compiler once your app is running
+
+```ts filename=server.js lines=[1-2,11]
+import { broadcastDevReady } from "@remix-run/node";
+// import { logDevReady } from "@remix-run/cloudflare" // use `logDevReady` if using CloudFlare
+
+const BUILD_DIR = path.join(process.cwd(), "build");
+
+// ... code setting up your server goes here ...
+
+const port = 3000;
+app.listen(port, async () => {
+  console.log(`👉 http://localhost:${port}`);
+  broadcastDevReady(await import(BUILD_DIR));
+});
+```
+
+4. (Optional) `--manual`
+
+If you were relying on `require` cache purging, you can keep doing so by using the `--manual` flag:
+
+```sh
+remix dev --manual -c 'node ./server.js'
+```
+
+Check out the [manual mode guide][manual-mode] for more details.
+
+### After upgrading from v1 to v2
+
+After you've enabled the `future.v2_dev` flag in v1 and gotten that working, you're ready to upgrade to v2.
+If you just had `v2_dev` set to `true`, you can remove it and things should work.
+
+If you are using `v2_dev` config, you'll need to move it to the `dev` config field:
+
+```diff filename=remix.config.js
+{
+-  future: {
+-    v2_dev: {
+-      port: 4004
+-    }
+-  }
++  dev: {
++    port: 4004
++  }
+}
+```
+
 ## File System Route Convention
 
 #### Upgrading without changing files
@@ -834,87 +935,6 @@ module.exports = {
 };
 ```
 
-## `remix dev`
-
-For configuration options, see the [`remix dev` docs][v2-dev-config].
-
-### `remix-serve`
-
-If you are using the Remix App Server (`remix-serve`), enable `v2_dev`:
-
-```js filename=remix.config.js
-/** @type {import('@remix-run/dev').AppConfig} */
-module.exports = {
-  future: {
-    v2_dev: true,
-  },
-};
-```
-
-That's it!
-
-### Custom app server
-
-If you are using your own app server (`server.js`),
-then check out our [templates][templates] for examples of how to integrate with `v2_dev`
-or follow these steps:
-
-1. Enable `v2_dev`:
-
-```js filename=remix.config.js
-/** @type {import('@remix-run/dev').AppConfig} */
-module.exports = {
-  future: {
-    v2_dev: true,
-  },
-};
-```
-
-2. Update `scripts` in `package.json`:
-
-- Replace any `remix watch` with `remix dev`
-- Remove redundant `NODE_ENV=development`
-- Use `-c` / `--command` to run your app server
-
-For example:
-
-```diff filename=package.json
-{
-  "scripts": {
--   "dev:remix": "cross-env NODE_ENV=development remix watch",
--   "dev:server": "cross-env NODE_ENV=development node ./server.js"
-+   "dev": "remix dev -c 'node ./server.js'",
-  }
-}
-```
-
-3. Send a "ready" message to the Remix compiler once your app is running
-
-```ts filename=server.js lines=[1-2,11]
-import { broadcastDevReady } from "@remix-run/node";
-// import { logDevReady } from "@remix-run/cloudflare" // use `logDevReady` if using CloudFlare
-
-const BUILD_DIR = path.join(process.cwd(), "build");
-
-// ... code setting up your server goes here ...
-
-const port = 3000;
-app.listen(port, async () => {
-  console.log(`👉 http://localhost:${port}`);
-  broadcastDevReady(await import(BUILD_DIR));
-});
-```
-
-4. (Optional) `--manual`
-
-If you were relying on `require` cache purging, you can keep doing so by using the `--manual` flag:
-
-```sh
-remix dev --manual -c 'node ./server.js'
-```
-
-Check out the [manual mode guide][manual-mode] for more details.
-
 ## `installGlobals`
 
 For preparation of using Node's built in fetch implementation, installing the fetch globals is now a responsibility of the app server. If you are using `remix-serve`, nothing is required. If you are using your own app server, you will need to install the globals yourself.