fix(v6): specify that the custom web index webpack only (#8772)

* fix(v6): custom web index is webpack only

* add color

docs/docs/cli-commands.md

@@ -1779,6 +1779,13 @@ yarn redwood setup cache <client>
 
 ### setup custom-web-index
 
+:::caution This command only applies to projects using Webpack
+
+As of v6, all Redwood projects use Vite by default.
+When switching projects to Vite, we made the decision to add the the entry file, `web/src/entry.client.{jsx,tsx}`, back to projects.
+
+:::
+
 Redwood automatically mounts your `<App />` to the DOM, but if you want to customize how that happens, you can use this setup command to generate an `index.js` file in `web/src`.
 
 ```

docs/docs/custom-web-index.md

@@ -4,6 +4,15 @@ description: Change how App mounts to the DOM
 
 # Custom Web Index
 
+:::caution This doc only applies to projects using Webpack
+
+As of v6, all Redwood projects use Vite by default.
+When switching projects to Vite, we made the decision to add the the entry file, `web/src/entry.client.{jsx,tsx}`, back to projects.
+
+If you're using Webpack, this is all still applicable—keep reading.
+
+:::
+
 You may have noticed that there's no call to `ReactDOM.render` in your Redwood app.
 That's because Redwood automatically mounts the `App` component in `web/src/App.js` to the DOM.
 But if you need to customize how this happens, you can provide a file named `index.js` in `web/src` and Redwood will use that instead.

packages/cli/src/commands/setup/custom-web-index/custom-web-index-handler.js

@@ -10,6 +10,13 @@ import { getPaths, writeFile } from '../../../lib'
 import c from '../../../lib/colors'
 
 export const handler = async ({ force }) => {
+  if (getPaths().web.viteConfig) {
+    console.warn(
+      c.warning('Warning: This command only applies to projects using webpack')
+    )
+    return
+  }
+
   const tasks = new Listr(
     [
       {

packages/cli/src/commands/setup/custom-web-index/custom-web-index.js

@@ -3,7 +3,7 @@ import { recordTelemetryAttributes } from '@redwoodjs/cli-helpers'
 export const command = 'custom-web-index'
 
 export const description =
-  'Set up a custom index.js file, so you can customise how Redwood web is mounted in your browser'
+  'Set up a custom index.js file, so you can customise how Redwood web is mounted in your browser (webpack only)'
 
 export const builder = (yargs) => {
   yargs.option('force', {