move postcss to vite config, and get rid of more WP dependencies

app/javascript/entrypoints/public.tsx

@@ -16,8 +16,6 @@ import { loadLocale, getLocale } from '../mastodon/locales';
 import { loadPolyfills } from '../mastodon/polyfills';
 import ready from '../mastodon/ready';
 
-import 'cocoon-js-vanilla';
-
 start();
 
 const messages = defineMessages({

package.json

@@ -63,37 +63,27 @@
     "babel-plugin-preval": "^5.1.0",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "blurhash": "^2.0.5",
-    "circular-dependency-plugin": "^5.2.2",
     "classnames": "^2.3.2",
-    "cocoon-js-vanilla": "^1.3.0",
     "color-blend": "^4.0.0",
     "compression-webpack-plugin": "^6.1.2",
     "core-js": "^3.30.2",
     "cross-env": "^7.0.3",
-    "css-loader": "^5.2.7",
-    "cssnano": "^7.0.0",
     "detect-passive-events": "^2.0.3",
     "emoji-mart": "npm:emoji-mart-lazyload@latest",
     "escape-html": "^1.0.3",
-    "file-loader": "^6.2.0",
     "fuzzysort": "^3.0.0",
     "glob": "^10.2.6",
     "history": "^4.10.1",
     "hoist-non-react-statics": "^3.3.2",
     "http-link-header": "^1.1.1",
     "immutable": "^4.3.0",
-    "imports-loader": "^1.2.0",
     "intl-messageformat": "^10.7.16",
     "js-yaml": "^4.1.0",
     "lande": "^1.0.10",
     "lodash": "^4.17.21",
-    "mark-loader": "^0.1.6",
     "marky": "^1.2.5",
-    "mini-css-extract-plugin": "^1.6.2",
     "path-complete-extname": "^1.0.0",
-    "postcss": "^8.4.24",
-    "postcss-loader": "^4.3.0",
-    "postcss-preset-env": "^10.0.0",
+    "postcss-preset-env": "^10.1.5",
     "prop-types": "^15.8.1",
     "punycode": "^2.3.0",
     "react": "^18.2.0",
@@ -118,7 +108,6 @@
     "regenerator-runtime": "^0.14.0",
     "requestidlecallback": "^0.3.0",
     "sass": "^1.62.1",
-    "sass-loader": "^10.2.0",
     "stacktrace-js": "^2.0.2",
     "stringz": "^2.1.0",
     "substring-trie": "^1.0.2",

postcss.config.js

@@ -1,14 +0,0 @@
-const postcssPresetEnv = require('postcss-preset-env');
-
-/** @type {import('postcss-load-config').Config} */
-const config = () => ({
-  plugins: [
-    postcssPresetEnv({
-      features: {
-        'logical-properties-and-values': false
-      }
-    }),
-  ],
-});
-
-module.exports = config;

tsconfig.json

@@ -3,10 +3,11 @@
     "jsx": "react-jsx",
     "target": "esnext",
     "module": "ES2022",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "allowJs": true,
     "noEmit": true,
     "strict": true,
+    "isolatedModules": true, // Required by Vite
     "noImplicitReturns": true,
     "noUncheckedIndexedAccess": true,
     "esModuleInterop": true,

vite.config.ts

@@ -1,5 +1,6 @@
 import path from 'node:path';
 
+import postcssPresetEnv from 'postcss-preset-env';
 import { defineConfig } from 'vite';
 
 import { manifestSRI } from './config/vite/plugin-manifest-sri';
@@ -7,6 +8,17 @@ import { manifestSRI } from './config/vite/plugin-manifest-sri';
 // eslint-disable-next-line import/no-default-export
 export default defineConfig({
   root: './app/javascript/entrypoints',
+  css: {
+    postcss: {
+      plugins: [
+        postcssPresetEnv({
+          features: {
+            'logical-properties-and-values': false,
+          },
+        }),
+      ],
+    },
+  },
   build: {
     commonjsOptions: { transformMixedEsModules: true },
     outDir: path.resolve(__dirname, '.dist'),