Vue Storefront Next

Follow these steps to deploy a Vue Storefront Next app on Edgio. As of now Edgio is only compatible with the Vue Storefront Next CLI tool.

For adding Edgio to Vue Storefront 1 app follow this guide.

Example #

Here’s an example Vue Storefront 2 app running on Edgio:

System Requirements #

• Install Node.js 14.19.0

Sign up for Edgio #

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

Install the Edgio CLI #

If you have not already done so, install the Edgio CLI.

1npm i -g @edgio/cli

Run the VSF CLI #

The Vue Storefront CLI tool will generate a preconfigured boilerplate project for you. Use these commands to create a new project and update to the latest dependencies.

1npx @vue-storefront/cli generate store

When prompted, enter the name of your project and the integration template:

1$ npx @vue-storefront/cli generate store
2? What's your project name? new-vsf-app
3? Choose an integration template: (Use arrow keys)
4❯ Shopify
5  Magento 2
6  Vendure
7  Kibo Commerce (beta)
8  Odoo
9  Prestashop
10  Spree
11(Move up and down to reveal more choices)

Once the generator has completed, go into the new project directory and install the Node dependencies:

1cd <project-name>
2npm install

Configuring your Vue Storefront app for Edgio #

Initialize your project #

In the root directory of your project run edgio init:

1edgio init

The Edgio init command should have automatically moved all your modules to buildModules in order to deploy the smallest possible build to Edgio.

Ensure @nuxtjs/pwa is not present in the buildModules. It is not needed because @edgio/nuxt/module builds and injects its own service worker.

Development #

Test your app with the Sites on your local machine by running the following command in your project’s root directory:

1edgio dev --cache

Building and Deploying #

Deploy your app to the Sites by running the following command in your project’s root directory:

1edgio deploy