From fc7b131bf7f73b1536432dd34ef6683222f9038b Mon Sep 17 00:00:00 2001
From: Anthony Fu <anthonyfu117@hotmail.com>
Date: Wed, 11 Oct 2023 18:31:14 +0800
Subject: [PATCH] feat(nuxt): auto-install optional features on StackBlitz
 (#23607)

---
 packages/nuxt/src/core/features.ts | 36 +++++++++++++++++++++---------
 packages/nuxt/src/core/nuxt.ts     | 10 +++++++--
 2 files changed, 33 insertions(+), 13 deletions(-)

diff --git a/packages/nuxt/src/core/features.ts b/packages/nuxt/src/core/features.ts
index 75048c8ce3..8920ab2c4d 100644
--- a/packages/nuxt/src/core/features.ts
+++ b/packages/nuxt/src/core/features.ts
@@ -1,10 +1,21 @@
 import { addDependency } from 'nypm'
 import { resolvePackageJSON } from 'pkg-types'
 import { logger } from '@nuxt/kit'
-import { isCI } from 'std-env'
+import { isCI, provider } from 'std-env'
 
-export async function ensurePackageInstalled (rootDir: string, name: string, searchPaths?: string[]) {
-  if (await resolvePackageJSON(name, { url: searchPaths }).catch(() => null)) {
+const isStackblitz = provider === 'stackblitz'
+
+export interface EnsurePackageInstalledOptions {
+  rootDir: string
+  searchPaths?: string[]
+  prompt?: boolean
+}
+
+export async function ensurePackageInstalled (
+  name: string,
+  options: EnsurePackageInstalledOptions
+) {
+  if (await resolvePackageJSON(name, { url: options.searchPaths }).catch(() => null)) {
     return true
   }
 
@@ -13,20 +24,23 @@ export async function ensurePackageInstalled (rootDir: string, name: string, sea
     return false
   }
 
-  const confirm = await logger.prompt(`Do you want to install ${name} package?`, {
-    type: 'confirm',
-    name: 'confirm',
-    initial: true
-  })
+  // In StackBlitz we install packages automatically by default
+  if (options.prompt === true || (options.prompt !== false && !isStackblitz)) {
+    const confirm = await logger.prompt(`Do you want to install ${name} package?`, {
+      type: 'confirm',
+      name: 'confirm',
+      initial: true
+    })
 
-  if (!confirm) {
-    return false
+    if (!confirm) {
+      return false
+    }
   }
 
   logger.info(`Installing ${name}...`)
   try {
     await addDependency(name, {
-      cwd: rootDir,
+      cwd: options.rootDir,
       dev: true
     })
     logger.success(`Installed ${name}`)
diff --git a/packages/nuxt/src/core/nuxt.ts b/packages/nuxt/src/core/nuxt.ts
index f56fd5d902..3b19e4f86c 100644
--- a/packages/nuxt/src/core/nuxt.ts
+++ b/packages/nuxt/src/core/nuxt.ts
@@ -443,7 +443,10 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
 
   // Nuxt DevTools is currently opt-in
   if (options.devtools === true || (options.devtools && options.devtools.enabled !== false)) {
-    if (await import('./features').then(r => r.ensurePackageInstalled(options.rootDir, '@nuxt/devtools', options.modulesDir))) {
+    if (await import('./features').then(r => r.ensurePackageInstalled('@nuxt/devtools', {
+      rootDir: options.rootDir,
+      searchPaths: options.modulesDir
+    }))) {
       options._modules.push('@nuxt/devtools')
     } else {
       logger.warn('Failed to install `@nuxt/devtools`, please install it manually, or disable `devtools` in `nuxt.config`')
@@ -452,7 +455,10 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
 
   // Nuxt Webpack Builder is currently opt-in
   if (options.builder === '@nuxt/webpack-builder') {
-    if (!await import('./features').then(r => r.ensurePackageInstalled(options.rootDir, '@nuxt/webpack-builder', options.modulesDir))) {
+    if (!await import('./features').then(r => r.ensurePackageInstalled('@nuxt/webpack-builder', {
+      rootDir: options.rootDir,
+      searchPaths: options.modulesDir
+    }))) {
       logger.warn('Failed to install `@nuxt/webpack-builder`, please install it manually, or change the `builder` option to vite in `nuxt.config`')
     }
   }