info
Based on your configuration Stormkit determines whether your application is served as single page or hybrid application.
warning

You will need to provide a next.config.js file in order to tell Stormkit that this is a Next.js framework. In the next releases this won't be needed however for now you'll have to add the config file even if it's empty.

module.exports = {}

Next.js

If you're using the serverless version of Next.js, you'll have to extend next.config.js and add a target: "serverless" declaration to it. The following configuration works for both local environments and Stormkit:

module.exports = {
  target: process.env.SK_APP_ID ? "serverless" : "server"
}

Next.js single page applications

  1. Go to your application.
  2. Click on your environment and then click on Edit.
  3. Turn off the serverless toggle to enable static websites.
  4. Create a stormkit.config.yml file at the root level of your repository and write the following configuration:
    app:
    - redirects:
        - from: /*
          to: /index.html
          assets: false
    

Next.js hybrid applications

For hybrid projects, we can either tell Next.js to point static assets directly to our CDN or can provide the stormkit.config.yml file. There is no preferred way, however, the next.config.js is less locked-in way.

Method 1: Using stormkit.config.yml

This configuration will tell Stormkit to serve anything that is under _next from the CDN. Stormkit also uploads all contents inside the public folder to the CDN. The public files are not prefixed with _next so we need to tell Stormkit those files directly from the CDN.

app:
- redirects:
    - from: /_next/*
      cdn: true
    - ext: js,css,ico,png,jpg,svg
      cdn: true

Method 2: Using next.config.js

The alternative method is to use the PUBLIC_URL environment variable (which is injected by Stormkit during build time) and tell Next.js to serve the static files from a different path. The following configuration will work either on local environments or Stormkit, as when the environment variable is not defined it will fallback to the default behaviour.

module.exports = {
  assetPrefix: process.env.PUBLIC_URL || "/"
}