Skip to content

Minimal Reproducible Example for Netlify dev debug with VS code

Notifications You must be signed in to change notification settings

MentalGear/netlify-dev_debug_vs-code

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Intro

Minimal Reproducible Example for fullstack netlify dev debugging with vs code.

Running: nuxt, vue, type-graphql, typescript, buefy, apollo-server-lambda on netlify functions.

Setup

yarn

VS Code Debugging

IMPORTANT

Make sure you have deactivated "Caught Exceptions" in VS Code debugger, otherwise you might catch internal node.js or other wrapping processes errors.

launch.json should contain everything you need to integrate debugging with your project.

In VS CODE:

  1. Open Run and Debug Sidebar. Make sure "Caught Exceptions" is deactivated.
  2. In the dropdown, select Fullstack Debugging
  3. Add a breakpoint in
  • /serverlessFunctions/helloServerless.ts or
  • /serverlessFunctions/graphql.ts
  1. Start debugging by pressing F5 or run button

Debug Examples

  1. Hello World example

    http://localhost:8888/.netlify/functions/helloServerless

  2. graphql.ts example

    http://localhost:8888/.netlify/functions/graphql

    Note: An error might display on first page load. Make sure to refresh the page and you should be at the playground.

    Query Example:

    query GetRecipe1 {
      recipe(title: "Recipe 1") {
        title
        description
        ratings
        creationDate
        ratingsCount(minRate: 2)
        averageRating
      }
    }