Merge pull request #2 from odestry/vite-plugin

feat: added vite plugin

.shopifyignore

@@ -2,10 +2,25 @@
 
 .DS_Store
 .DS_Store?
-.Spotlight-V100
-.Trashes
-ehthumbs.db
-Thumbs.db
-node_modules
 package.json
 package-lock.json
+pnpm-lock.yaml
+bun.lockb
+
+postcss.config.cjs
+tailwind.config.cjs
+vite.config.js
+.editorconfig
+.eslintrc.cjs
+.prettierrc.cjs
+jsconfig.json
+
+.gitignore
+.shopifyignore
+.prettierignore
+.eslintignore
+.theme-check.yml
+*.md
+/.vscode
+/.vim
+assets/.vite/

assets/.vite/manifest.json

@@ -0,0 +1,11 @@
+{
+  "entry.theme.js": {
+    "file": "entry.theme.-1DTOjwF.min.js",
+    "name": "entry.theme",
+    "src": "entry.theme.js",
+    "isEntry": true,
+    "css": [
+      "entry.YiHgjETv.min.css"
+    ]
+  }
+}

components/counter.js

@@ -0,0 +1,3 @@
+export function counter (num) {
+  return num + 1
+}

components/index.js

@@ -0,0 +1 @@
+export { counter } from './counter'

entry.theme.js

@@ -0,0 +1,5 @@
+import '~/styles/tailwind.css';
+
+import { counter } from '~/components'
+
+console.log(counter(1))

package.json

@@ -1,17 +1,18 @@
 {
-  "name": "theme-name",
+  "name": "theme-starter",
   "version": "1.0.2",
-  "private": true,
   "type": "module",
+  "private": true,
   "scripts": {
-    "dev": "run-p -sr shopify:dev watch",
-    "shopify:dev": "shopify theme dev -e dev",
+    "dev": "run-p -sr \"shopify:dev -- {@}\" \"vite:dev\" --",
+    "shopify:dev": "shopify theme dev",
+    "vite:dev": "vite",
     "pull": "shopify theme pull -d -o sections/*.json templates/*.json templates/customers/*.json config/settings_data.json",
-    "watch": "vite build -w",
-    "build": "vite build --minify",
+    "build": "vite build",
     "release": "bumpp"
   },
   "devDependencies": {
+    "@by-association-only/vite-plugin-shopify-clean": "^2.0.0",
     "@shopify/cli": "^3.65.3",
     "@shopify/prettier-plugin-liquid": "^1.5.0",
     "@shopify/theme": "^3.58.2",
@@ -21,6 +22,7 @@
     "postcss": "^8.4.41",
     "prettier": "^3.3.3",
     "tailwindcss": "^3.4.10",
-    "vite": "^5.4.1"
+    "vite": "^5.4.1",
+    "vite-plugin-shopify": "^3.0.1"
   }
 }

snippets/entry.liquid

@@ -4,6 +4,6 @@
 {% endcomment %}
 {% assign path = entry | replace: '~/', '../../' | replace: '@/', '../' %}
 {% if path == "/entry.theme.js" or path == "../../entry.theme.js" %}
-  <script src="{{ 'entry.theme.DAmrlBVT.min.js' | asset_url | split: '?' | first }}" type="module" crossorigin="anonymous"></script>
-  {{ 'entry.DJqbQjLU.min.css' | asset_url | split: '?' | first | stylesheet_tag: preload: preload_stylesheet }}
+  <script src="{{ 'entry.theme.-1DTOjwF.min.js' | asset_url | split: '?' | first }}" type="module" crossorigin="anonymous"></script>
+  {{ 'entry.YiHgjETv.min.css' | asset_url | split: '?' | first | stylesheet_tag: preload: preload_stylesheet }}
 {% endif %}

vite.config.ts

@@ -1,16 +1,28 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vite';
+import path from 'path'
+import shopify from 'vite-plugin-shopify';
+import cleanup from '@by-association-only/vite-plugin-shopify-clean'
 
 export default defineConfig({
+  resolve: {
+    alias: {
+      '~': path.resolve(__dirname, './'),
+    },
+  },
+  plugins: [
+    shopify({
+      additionalEntrypoints: ['entry.theme.js'],
+      snippetFile: 'entry.liquid'
+    }),
+    cleanup()
+  ],
   build: {
-    outDir: 'assets',
-    emptyOutDir: false,
-    minify: false,
     rollupOptions: {
-      input: 'styles.css',
       output: {
-        dir: 'assets',
-        assetFileNames: '[name][extname]',
+        entryFileNames: '[name].[hash].min.js',
+        chunkFileNames: '[name].[hash].min.js',
+        assetFileNames: '[name].[hash].min[extname]'
       }
     }
   }
-})
+});