v4.9.0
SIGN UP
LOGIN
FIDDLEFORUMSSTATUS
SUPPORT

This guide shows you how to deploy a Ionic React application on Layer0.

Deploying requires an account on Layer0. Sign up here for free.

If you have not already done so, install the Layer0 CLI

npm i -g @layer0/cli

If you don't already have a Ionic React app, create one by running the following:

npm install -g @ionic/cli
ionic start myApp tabs --type react
cd myApp

You can verify your app works by running it locally with:

npm run start

In the root directory of your project run 0 init:

0 init

This will automatically update your package.json and add all of the required Layer0 dependencies and files to your project. These include:

  • The @layer0/core package - Allows you to declare routes and deploy your application on Layer0
  • The @layer0/prefetch package - Allows you to configure a service worker to prefetch and cache pages to improve browsing speed
  • layer0.config.js - A configuration file for Layer0
  • routes.js - A default routes file that sends all requests to Ionic React.

Update routes.js at the root of your project to the following:

// This file was added by layer0 init.
// You should commit this file to source control.

import { Router } from '@layer0/core/router'

export default new Router()
  .static('build', ({ cache }) => {
    cache({
      edge: {
        maxAgeSeconds: 60 * 60 * 60 * 365,
        forcePrivateCaching: true,
      },
      browser: {
        maxAgeSeconds: 0,
        serviceWorkerSeconds: 60 * 60 * 24,
      },
    })
  })
  .fallback(({ appShell }) => {
    appShell('build/index.html')
  })

Refer to the Routing guide for the full syntax of the routes.js file and how to configure it for your use case.

Create a production build of your app by running the following in your project's root directory:

npm run build

Run Layer0 on your local machine:

0 dev

Load the site http://127.0.0.1:3000

Create a production build of your app by running the following in your project's root directory:

npm run build

Next, deploy the build to Layer0 by running the 0 deploy command:

0 deploy

Refer to the Deploying guide for more information on the deploy command and its options.

Edit this guide on GitHub