strapi / strapi-starter-nuxt-e-commerce

Strapi Starter Nuxt.js E-commerce

⛔ Deprecated

This repository is no longer maintained and only works for Strapi v3. To find the newest Strapi v4 starters, check out the starters-and-templates monorepo.

---

Strapi Starter Nuxt.js E-commerce

Nuxt.js starter for creating a simple e-commerce website with Strapi.

This starter allows you to try Strapi with Nuxt.js with the example of a simple e-commerce website where you can buy dev stickers. It is fully customizable and due to the fact that it is open source, fully open to contributions. So do not hesitate to add new features and report bugs!

This starter uses the Strapi corporate template

Check out all of our starters here

Features

• 1 Component
• 2 Collection types: Product, Category
• 27 Created products
• 6 Created categories
• Permissions set to true for product and category
• Responsive design using Tailwind css
• Slug system
• Publication system (draft & published)
• Role based access controls
• @nuxt/strapi module on the frontend
• Payments handled with Snipcart

This starter is using Snipcart which allows you setup a shopping cart on any website. They wrote a tutorial teaching you how to create this website but selling cupcakes!

Payment will not work on localhost, we are redirecting you to this tutorial if you want to test payment locally.

Getting started

Use our create-strapi-starter CLI to create your project.

npx create-strapi-starter@3 my-site nuxt-e-commerce

The CLI will create a monorepo, install dependencies, and run your project automatically.

The Nuxt frontend server will run here => http://localhost:3000

The Strapi backend server will run here => http://localhost:1337

Deploying to production

You will need to deploy the frontend and backend projects separately. Here are the docs to deploy each one:

• Deploy Strapi
• Deploy Nuxt

Don't forget to setup the environment variables on your production app:

For the frontend the following environment variable is required:

• API_URL: URL of your Strapi backend, without trailing slash

Enjoy this starter!

strapi-starter-nuxt-e-commerce's Issues

Error: No Output Directory named "dist" found after the Build completed

Error: No Output Directory named "dist" found after the Build completed. You can configure the Output Directory in your Project Settings. Learn More: https://vercel.link/missing-public-directory

Several attempts failed yet again. Heroku build success. Vercel Build cannot be deployed.

JSON issue when trying to yarn create

I tried to install this starter exemple with both yarn and npm, and i got the same output everytime.
OS: Windows 10
node -v: v14.15.4
npm -v: 8.3.0
yarn -v: 1.22.15

PS C:\......> yarn create strapi-starter my-project nuxt-e-commerce
yarn create v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed "[email protected]" with binaries:
      - create-strapi-starter
? Choose your installation type Quickstart (recommended)
This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason:
SyntaxError: Unexpected end of JSON input
    at JSON.parse (<anonymous>)
    at getPackageInfo (C:\Users\noheh\AppData\Local\Yarn\Data\global\node_modules\create-strapi-starter\utils\fetch-npm-starter.js:19:27)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async getStarterInfo (C:\Users\noheh\AppData\Local\Yarn\Data\global\node_modules\create-strapi-starter\utils\build-starter.js:109:26)
    at async buildStarter (C:\Users\noheh\AppData\Local\Yarn\Data\global\node_modules\create-strapi-starter\utils\build-starter.js:133:7)
Done in 4.11s.

Any idea ?

Edit:

Tried on wsl2, same issue.
Same issue with other starters & when using templates, but i can create a default strapi app

Nuxt or Next

Is this project for Nuxt or Next? I also can't run npm run develop

#/cart won't work with additional layouts?

If I add additional layouts to my Nuxt file #/cart stops working and I can't work out why?

I don't get any form of error in logs, and refreshing the #/cart page even seems to load. Clicking the add to cart button updates the URL but won't change the view.

404: NOT_FOUND

Live demo it does not work :(