Next.js: open browser after app started

Created on 27 Apr 2020 · 4Comments · Source: vercel/next.js

Is there plan to add automatically open browser after app started?
This feature is in create-react-app and would be nice to have that too, do you agree?

Nice example:

╭────────────────────────────────────────────────────╮
│                                                    │
│   Storybook 5.3.18 started                         │
│   18 s for manager and 14 s for preview            │
│                                                    │
│    Local:            http://localhost:9001/        │
│    On your network:  http://192.168.0.213:9001/    │
│                                                    │
╰────────────────────────────────────────────────────╯

Source

landsman

👍11 ❤3

All 4 comments

We're not planning to add automatically opening the browser at this point (keeping the CLI minimal and features contained).

timneutkens on 25 May 2020

😕8 👍1

@timneutkens Hello Tim 👋

What would be the proper way of doing in the current state? I suppose we can do it using a custom server, in the server.listen() callback? Is there any solution without the custom server?

jgoux on 6 Aug 2020

VS Code only:

// .vscode/launch.json

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Chrome",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceRoot}/src",
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*"
      },
      "preLaunchTask": "npm: dev"
    }
  ]
}

// .vscode/tasks.json

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "2.0.0",
  "tasks": [
    {
      "type": "npm",
      "script": "dev",
      "group": {
        "kind": "test",
        "isDefault": true
      },
      "isBackground": true, //This prevents the launch.json to wait for the completion of the task
      "problemMatcher": {
        "owner": "custom", //This is not needed but, required by the problemMatcher Object
        "pattern": {
          "regexp": "^$" //This is not needed but, required by the problemMatcher Object
        },
        "background": {
          "activeOnStart": true,
          "beginsPattern": "started server on .*", //Signals the begin of the Task
          "endsPattern": "compiled .*" //Signals that now the initialization of the task is complete
        }
      }
    }
  ]
}

Then press F5