diff --git a/src/nuxt/nuxt-wizard.ts b/src/nuxt/nuxt-wizard.ts index 6a4c17c9..97f80cb1 100644 --- a/src/nuxt/nuxt-wizard.ts +++ b/src/nuxt/nuxt-wizard.ts @@ -27,6 +27,7 @@ import { createConfigFiles, addNuxtOverrides, askDeploymentPlatform, + confirmReadImportDocs, } from './sdk-setup'; import { createExampleComponent, @@ -34,7 +35,6 @@ import { supportsExamplePage, } from './sdk-example'; import { isNuxtV4 } from './utils'; -import { DeploymentPlatform } from './types'; export function runNuxtWizard(options: WizardOptions) { return withTelemetry( @@ -152,33 +152,19 @@ export async function runNuxtWizardWithTelemetry( await runPrettierIfInstalled(); + await confirmReadImportDocs(deploymentPlatform); + clack.outro( - buildOutroMessage( - shouldCreateExamplePage, - shouldCreateExampleButton, - deploymentPlatform, - ), + buildOutroMessage(shouldCreateExamplePage, shouldCreateExampleButton), ); } function buildOutroMessage( shouldCreateExamplePage: boolean, shouldCreateExampleButton: boolean, - deploymentPlatform: DeploymentPlatform | symbol, ): string { - const canImportSentryServerConfigFile = - deploymentPlatform !== 'vercel' && deploymentPlatform !== 'netlify'; - let msg = chalk.green('\nSuccessfully installed the Sentry Nuxt SDK!'); - if (canImportSentryServerConfigFile) { - msg += `\n\nAfter building your Nuxt app, you need to ${chalk.cyan( - '--import', - )} the Sentry server config file when running your app.\n\nFor more info see: ${chalk.cyan( - 'https://docs.sentry.io/platforms/javascript/guides/nuxt/install/cli-import/#initializing-sentry-with---import', - )}`; - } - if (shouldCreateExamplePage) { msg += `\n\nYou can validate your setup by visiting ${chalk.cyan( '"/sentry-example-page"', @@ -190,7 +176,7 @@ function buildOutroMessage( )} component to a page and triggering it.`; } - msg += `\n\nCheck out the SDK documentation for further configuration: ${chalk.cyan( + msg += `\n\nCheck out the SDK documentation for further configuration: ${chalk.underline( 'https://docs.sentry.io/platforms/javascript/guides/nuxt/', )}`; diff --git a/src/nuxt/sdk-setup.ts b/src/nuxt/sdk-setup.ts index 0630b66f..1ce444e3 100644 --- a/src/nuxt/sdk-setup.ts +++ b/src/nuxt/sdk-setup.ts @@ -21,6 +21,7 @@ import { featureSelectionPrompt, installPackage, isUsingTypeScript, + opn, } from '../utils/clack-utils'; import { traceStep } from '../telemetry'; import { lt, SemVer } from 'semver'; @@ -88,7 +89,7 @@ export async function addSDKModule( `${deploymentPlatform .charAt(0) .toUpperCase()}${deploymentPlatform.slice(1)}`, - )} does not support this yet.\n\nWe will inject the Sentry server-side config at the top of your Nuxt server entry file instead.\n\nThis comes with some restrictions, for more info see:\n\n${chalk.cyan( + )} does not support this yet.\n\nWe will inject the Sentry server-side config at the top of your Nuxt server entry file instead.\n\nThis comes with some restrictions, for more info see:\n\n${chalk.underline( 'https://docs.sentry.io/platforms/javascript/guides/nuxt/install/top-level-import/', )} `, ); @@ -265,11 +266,11 @@ export async function addNuxtOverrides( clack.log.warn( `To ensure Sentry can properly instrument your code it needs to add version overrides for some Nuxt dependencies${ isPNPM ? ` and install ${chalk.cyan('import-in-the-middle')}.` : '.' - }\n\nFor more info see: ${chalk.cyan( + }\n\nFor more info see: ${chalk.underline( 'https://github.com/getsentry/sentry-javascript/issues/14514', )}${ isPNPM - ? `\n\nand ${chalk.cyan( + ? `\n\nand ${chalk.underline( 'https://docs.sentry.io/platforms/javascript/guides/nuxt/troubleshooting/#pnpm-dev-cannot-find-package-import-in-the-middle', )}` : '' @@ -309,3 +310,36 @@ export async function addNuxtOverrides( } } } + +export async function confirmReadImportDocs( + deploymentPlatform: DeploymentPlatform | symbol, +) { + const canImportSentryServerConfigFile = + deploymentPlatform !== 'vercel' && deploymentPlatform !== 'netlify'; + + if (!canImportSentryServerConfigFile) { + // Nothing to do, users have been set up with automatic top-level-import instead + return; + } + + const docsUrl = + 'https://docs.sentry.io/platforms/javascript/guides/nuxt/install/cli-import/#initializing-sentry-with---import'; + + clack.log.info( + `After building your Nuxt app, you need to ${chalk.bold( + '--import', + )} the Sentry server config file when running your app.\n\nFor more info, see:\n\n${chalk.underline( + docsUrl, + )}`, + ); + + const shouldOpenDocs = await abortIfCancelled( + clack.confirm({ message: 'Do you want to open the docs?' }), + ); + + if (shouldOpenDocs) { + opn(docsUrl, { wait: false }).catch(() => { + // opn throws in environments that don't have a browser (e.g. remote shells) so we just noop here + }); + } +} diff --git a/src/utils/clack-utils.ts b/src/utils/clack-utils.ts index b31fcae3..c15d1827 100644 --- a/src/utils/clack-utils.ts +++ b/src/utils/clack-utils.ts @@ -20,7 +20,7 @@ import { import { debug } from './debug'; import { fulfillsVersionRange } from './semver'; -const opn = require('opn') as ( +export const opn = require('opn') as ( url: string, options?: { wait?: boolean;