Om du någonsin har velat utveckla Shopify-teman lokalt – med live-förhandsgranskning, automatisk uppdatering (hot reload) och utan några hostingkostnader – då är den här guiden för dig.
Jag satte upp detta på min MacBook Pro, stötte på några vanliga CLI-fel längs vägen och dokumenterade allt så att du kan hoppa över förvirringen.
Vad du får ut av denna guide
- Bygg och anpassa Shopify-teman lokalt (ingen betald plan behövs)
- Arbeta i en gratis Shopify Development Store
- Använd Shopify CLI v3+ för live-förhandsgranskning och automatisk uppdatering
- Fixa vanliga fel som “Command login not found. Did you mean auth login?”
“Nonexistent flag: –store”
Låt oss börja!
Skapa din gratis Shopify Development Store
Shopify erbjuder gratis utvecklingsbutiker via Shopify Partners-panelen.
- Logga in eller skapa ett Partner-konto.
- Gå till Stores → Add store → Create development store.
- Ge den ett namn, t.ex. test.
Du får en URL som:test.myshopify.com
Installera Shopify CLI och beroenden (macOS)
Öppna din terminal och installera det du behöver:
# Installera Node.js (LTS)
brew install node
# Installera Shopify CLI
npm install -g @shopify/cli @shopify/theme
# Kontrollera installationen
shopify version
Valfritt men användbart:
# Installera Theme Check (validerar Liquid & JSON)
sudo gem install theme-check
Anslut Shopify CLI till din butik
Här stötte jag på första problemet!
Först försökte jag:
shopify login --store test.myshopify.com
Fel:
Command
loginnot found. Did you meanauth login?
Okej, så jag försökte:
shopify auth login --store test.myshopify.com
Ett nytt fel:
Nonexistent flag: –store
Det visar sig att Shopify CLI v3.60+ inte längre accepterar flaggan --store.
Korrekt kommando är:
shopify auth login
Följ sedan webbläsarens inloggningsprompt:
- Logga in med ditt Shopify Partner-konto
- Välj din utvecklingsbutik
Verifiera att det fungerade:
shopify auth whoami
Förväntad output:
Organization: My Partner Org
Store: test.myshopify.com
Account: your-email@example.com
Om butiken inte är satt ännu:
shopify config set store test.myshopify.com
Skapa och kör ditt första tema lokalt
Nu till det roliga!
Starta ett nytt tema:
shopify theme init test
cd test
Starta lokal utveckling med automatisk uppdatering:
shopify theme dev
Det öppnas en live-förhandsgranskning:
https://test.myshopify.com/?preview_theme_id=1234567890
Varje gång du sparar en fil uppdateras sidan direkt i webbläsaren.
Ingen hosting, inga avgifter.
Proffstips för smidig lokal utveckling
- Säker förhandsgranskning: Shopify CLI använder ett utvecklingstema, inte ditt aktiva.
- Formatera Liquid automatiskt:
npm install -D prettier prettier-plugin-liquid npx prettier --write . - Lint för fel:
theme-check - Tryck upp ändringar manuellt:
shopify theme push
Vanliga fel (och lösningar)
| Fel | Orsak | Lösning |
|---|---|---|
Command login not found | CLI v3+ ändrade syntax | Använd shopify auth login |
Nonexistent flag: --store | Nyare CLI använder inte --store | Kör bara shopify auth login och välj butik |
| Fel vid anslutning till butik | Fel butik eller utgången session | shopify auth logout && shopify auth login |
| Åtkomst nekad | Partner-konto ej länkat till butik | Säkerställ att du har collaborator-åtkomst |
| Förhandsgranskning laddas inte | Cache eller sessionsproblem | Gör en hård uppdatering eller kör om shopify theme dev |
Slutsats
Du behöver inte en betald Shopify-plan eller avancerad setup för att börja skapa teman.
Med bara Node.js, Shopify CLI och en gratis utvecklingsbutik kan du:
- Bygga teman lokalt
- Testa direkt med automatisk uppdatering
- Trycka upp uppdateringar direkt från terminalen
Nu är du redo att designa, utveckla och publicera ditt eget Shopify-tema — direkt från din MacBook Pro, helt gratis.
SEO-nyckelord:
Shopify CLI, Shopify lokal utveckling, Shopify tema setup, Shopify development store, utveckla Shopify-tema lokalt, Shopify CLI-fel, Shopify gratis setup, Shopify utveckling på Mac.
Vill du att jag formaterar det här som en bloggartikel för Snarwebs webbplats (med rubriker, kodblock, bilder och SEO-metadata)?