Update deps and simplify setup

package.json

@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "description": "Svelte with Tailwind and Parcel",
   "main": "./src/main.js",
-  "author": "iljoo",
+  "author": "codechips",
   "license": "MIT",
   "private": false,
   "scripts": {
@@ -14,15 +14,15 @@
     "last 1 chrome versions"
   ],
   "devDependencies": {
-    "@fullhuman/postcss-purgecss": "^2.1.0",
-    "autoprefixer": "^9.7.3",
     "eslint-plugin-svelte3": "^2.7.3",
     "parcel-bundler": "^1.12.4",
-    "parcel-plugin-svelte": "^4.0.5",
-    "prettier": "^2.0.2",
-    "prettier-plugin-svelte": "^0.7.0",
-    "svelte": "^3.16.7",
-    "tailwindcss": "^1.1.4",
-    "tailwindcss-font-inter": "^1.0.7"
+    "parcel-plugin-svelte": "^4.0.6",
+    "postcss-load-config": "^3.0.0",
+    "postcss-preset-env": "^6.7.0",
+    "prettier": "^2.1.2",
+    "prettier-plugin-svelte": "^1.4.0",
+    "svelte": "^3.29.0",
+    "tailwindcss": "^1.8.10",
+    "tailwindcss-font-inter": "^1.0.8"
   }
 }

postcss.config.js

@@ -1,6 +1,13 @@
-const plugins =
-  process.env.NODE_ENV === 'production'
-    ? ['tailwindcss', 'autoprefixer', '@fullhuman/postcss-purgecss']
-    : ['tailwindcss'];
+const postcssPresetEnv = require('postcss-preset-env');
 
-module.exports = {plugins};
+const presetEnv = postcssPresetEnv({
+  /* use stage 3 features + css nesting rules */
+  stage: 3,
+  features: {
+    'nesting-rules': true,
+  },
+});
+
+module.exports = {
+  plugins: [require('tailwindcss'), presetEnv],
+};

tailwind.config.js

@@ -1,32 +1,28 @@
 module.exports = {
+  future: {
+    removeDeprecatedGapUtilities: true,
+  },
+  experimental: {
+    uniformColorPalette: true,
+    extendedFontSizeScale: true,
+    applyComplexClasses: true,
+  },
+  purge: {
+    content: ['./src/index.html', './src/**/*.svelte'],
+    whitelistPatterns: [/svelte-/],
+  },
   theme: {
     interFontFeatures: {
       default: ['calt', 'liga', 'kern'],
-      numeric: ['tnum', 'salt', 'ss02']
-    },
-    fontSize: {
-      xs: '0.75rem',
-      sm: '0.875rem',
-      base: '1rem',
-      lg: '1.125rem',
-      xl: '1.25rem',
-      '2xl': '1.5rem',
-      '3xl': '1.875rem',
-      '4xl': '2.25rem',
-      '5xl': '3rem',
-      '6xl': '4rem',
-      '7xl': '6rem',
-      '8xl': '8rem',
-      '9xl': '9rem',
-      '10xl': '10rem'
+      numeric: ['tnum', 'salt', 'ss02'],
     },
-    extend: {}
+    extend: {},
   },
   variants: {},
   plugins: [
     require('tailwindcss-font-inter')({
       importFontFace: true,
-      disableUnusedFeatures: true
-    })
-  ]
+      disableUnusedFeatures: true,
+    }),
+  ],
 };