[DEPRECATED]

This package is deprecated. To integrate a third party script with your Nuxt project, follow our docs here: https://docs.getnacelle.com/nuxt/external-scripts.html

Nacelle Swell Nuxt Module

Adds Vue.js components for integrating Swell loyalty and referrals in your Nacelle Nuxt project.

Requirements

• A Nacelle project set up locally. See https://docs.getnacelle.com for getting started.
• A Swell app installed and setup on your Shopify store.

Setup

Add Module to Nacelle

Once you hace Nacelle and Swell set up you can install this module in your project from npm:

npm install @nacelle/nacelle-swell-nuxt-module --save

After the package has installed, open nuxt.config.js. Under modules add @nacelle/nacelle-swell-nuxt-module to the array. It should look something like this:

modules: [
  '@nuxtjs/pwa',
  '@nuxtjs/dotenv',
  '@nacelle/nacelle-nuxt-module',
  '@nuxtjs/sitemap',
  '@nacelle/nacelle-swell-nuxt-module'
],

Then add your Swell GUID to your environment variables .env file.

SWELL_GUID=xxxxxxxxxxxxx

Add the components to your Nacelle Storefront

To make the Swell widget visible in your store, open up layouts/default.vue and paste <swell-widget /> just before the closing div in the template.

Shopify Setup

To complete the integration a liquid snippet needs to be added to your Shopify theme.

Open your Shopify theme code editor under "Actions > Edit Code". Under "Snippets" click "Add new snippet". Name the snippet swell-nacelle-init.liquid, paste the following code found here.

Open layout/theme.liquid and and before the closing body tag paste {% include 'swell-nacelle-init' %}. Your Shopify account pages will now set the correct Swell data to be used in your Nacelle store.