Attempt to simplify assets config by repalcing webpack with phx 1.6 esbuild

Author: grzuy

.github/workflows/elixir.yml

@@ -29,7 +29,7 @@ jobs:
     - name: Install yarn dependencies
       run: yarn --cwd assets
     - name: Compile assets
-      run: cd assets && ./node_modules/.bin/webpack --mode development
+      run: mix esbuild default && cd assets && yarn build
     - name: Compile elixir deps
       run: MIX_ENV=test mix deps.compile
     - name: Compile elixir project

assets/.babelrc

@@ -3,32 +3,13 @@
   "description": " ",
   "license": "MIT",
   "scripts": {
-    "deploy": "webpack --mode production",
-    "watch": "webpack --mode development --watch"
-  },
-  "dependencies": {
-    "phoenix": "file:../deps/phoenix",
-    "phoenix_html": "file:../deps/phoenix_html",
-    "phoenix_live_view": "file:../deps/phoenix_live_view"
+    "deploy": "NODE_ENV=production tailwindcss --postcss --minify -i css/app.css -o ../priv/static/assets/app.css",
+    "watch": "NODE_ENV=development tailwindcss --postcss --watch -i css/app.css -o ../priv/static/assets/app.css",
+    "build": "NODE_ENV=development tailwindcss --postcss -i css/app.css -o ../priv/static/assets/app.css"
   },
   "devDependencies": {
     "autoprefixer": "^10.3.6",
-    "@babel/core": "^7.0.0",
-    "@babel/preset-env": "^7.0.0",
-    "babel-loader": "^8.0.0",
-    "copy-webpack-plugin": "^4.5.0",
-    "css-loader": "^2.1.1",
-    "hard-source-webpack-plugin": "^0.13.1",
-    "mini-css-extract-plugin": "^0.4.0",
-    "optimize-css-assets-webpack-plugin": "^5.0.1",
     "postcss": "^8.3.8",
-    "postcss-loader": "^4.0.0",
-    "tailwindcss": "^2.2.16",
-    "terser-webpack-plugin": "^1.1.0",
-    "webpack": "4.4.0",
-    "webpack-cli": "^3.3.2"
-  },
-  "resolutions": {
-    "serialize-javascript": "^2.1.1"
+    "tailwindcss": "^2.2.16"
   }
 }

assets/package.json

@@ -1,8 +1,11 @@
 const colors = require('tailwindcss/colors')
 
 module.exports = {
-  purge: [],
-  darkMode: false, // or 'media' or 'class'
+  mode: 'jit',
+  purge: [
+    './js/**/*.js',
+    '../lib/*_web/**/*.*ex'
+  ],
   theme: {
     extend: {
       colors: {