Merge pull request #15 from statamic/v4-upgrade

Switch to Vite and update the Getting Started Widget for v4 TailwindCSS

package.json

@@ -1,24 +1,15 @@
 {
     "private": true,
     "scripts": {
-        "dev": "mix",
-        "development": "mix",
-        "watch": "mix watch",
-        "watch-poll": "mix watch -- --watch-options-poll=1000",
-        "hot": "mix watch --hot",
-        "prod": "mix --production",
-        "production": "mix --production"
+        "dev": "vite",
+        "build": "vite build"
     },
     "devDependencies": {
-        "autoprefixer": "^10.2.5",
-        "cross-env": "^7.0",
-        "laravel-mix": "^6.0",
-        "postcss": "^8.2.9",
-        "postcss-import": "^14.0.1",
-        "postcss-nested": "^5.0.5",
-        "postcss-preset-env": "^6.7.0",
-        "tailwindcss": "^2.1.1",
-        "vue-template-compiler": "^2.6.12"
+        "autoprefixer": "^10.4.14",
+        "laravel-vite-plugin": "^0.7.2",
+        "postcss": "^8.4.23",
+        "tailwindcss": "^3.3.2",
+        "vite": "^4.0.0"
     },
     "dependencies": {
         "@hotwired/turbo": "^7.0.0-rc.1",

postcss.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+  plugins: {
+    'postcss-import': {},
+    'tailwindcss/nesting': {},
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

public/build/assets/site-4ed993c7.js

@@ -0,0 +1 @@
+

public/build/manifest.json

@@ -0,0 +1,12 @@
+{
+  "resources/css/site.css": {
+    "file": "assets/site-ab9fe09b.css",
+    "isEntry": true,
+    "src": "resources/css/site.css"
+  },
+  "resources/js/site.js": {
+    "file": "assets/site-381f6df3.js",
+    "isEntry": true,
+    "src": "resources/js/site.js"
+  }
+}

resources/views/layout.antlers.html

@@ -5,10 +5,9 @@
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         {{ partial:seo }}
-        <link rel="stylesheet" href="{{ mix src='css/tailwind.css' }}" data-turbolinks-track="reload">
         <link rel="stylesheet" href="/css/plyr.css">
         <link rel="alternate" type="application/rss+xml" title="RSS Feed for {{ podcast:title }}" href="{{ route:feed }}" />
-        <script src="{{ mix src='/js/site.js' }}" data-turbolinks-track="reload" defer></script>
+        {{ vite src="resources/js/site.js|resources/css/tailwind.css" attr:data-turbolinks-track="reload" attr:script="defer" }}
         <style>
             :root {
                 --primary-color: {{ theme:primary_color ?? "#FA7268" }};