Replace Webpacker with esbuild / jsbundling-rails

bensheldon · Apr 23, 2023 · 0d3edb5 · 0d3edb5
1 parent c5bde23
commit 0d3edb5
Show file tree

Hide file tree

Showing 32 changed files with 176 additions and 9,124 deletions.
diff --git a/.browserslistrc b/.browserslistrc
diff --git a/.eslintrc.yml b/.eslintrc.yml
diff --git a/.gitignore b/.gitignore
@@ -44,3 +44,6 @@ npm-debug.log
 /yarn-error.log
 yarn-debug.log*
 .yarn-integrity
+
+/app/assets/builds/*
+!/app/assets/builds/.keep
diff --git a/.postcssrc.yml b/.postcssrc.yml
diff --git a/.stylelintrc b/.stylelintrc
diff --git a/Brewfile b/Brewfile
@@ -1,3 +1,4 @@
 # frozen_string_literal: true
 
 brew "chromedriver"
+brew "esbuild"
diff --git a/Dockerfile.fly b/Dockerfile.fly
@@ -1,4 +1,4 @@
-FROM ruby:3.2.1-bullseye
+FROM ruby:3.2.2-bullseye
 
 ENV BUNDLE_JOBS=4
 ENV BUNDLE_RETRY=3
@@ -14,6 +14,7 @@ RUN apt-get update -qq \
       nodejs \
       npm \
       postgresql-client \
+      esbuild \
     && rm -rf /var/lib/apt/lists/*
 
 RUN mkdir /project

diff --git a/Gemfile b/Gemfile
@@ -24,6 +24,7 @@ gem 'groupdate'
 gem 'jbuilder', '~> 2.5'
 gem 'jquery-rails'
 gem 'jquery-tablesorter'
+gem 'jsbundling-rails'
 gem 'kramdown'
 gem 'lograge'
 gem 'momentjs-rails'
@@ -42,7 +43,6 @@ gem 'slim'
 gem 'slim-rails'
 gem 'textacular'
 gem 'uglifier', '>= 1.3.0'
-gem 'webpacker'
 
 group :production, :staging do
   gem 'rack-timeout'

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -204,6 +204,8 @@ GEM
       thor (>= 0.14, < 2.0)
     jquery-tablesorter (1.27.2)
       railties (>= 3.2)
+    jsbundling-rails (1.1.1)
+      railties (>= 6.0.0)
     json (2.6.3)
     kramdown (2.4.0)
       rexml
@@ -274,8 +276,6 @@ GEM
     rack (2.2.6.4)
     rack-host-redirect (1.3.0)
       rack
-    rack-proxy (0.7.6)
-      rack
     rack-test (2.1.0)
       rack (>= 1.3)
     rack-timeout (0.6.3)
@@ -385,7 +385,6 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
-    semantic_range (3.0.0)
     sentry-raven (2.13.0)
       faraday (>= 0.7.6, < 1.0)
     sitemap_generator (6.3.0)
@@ -428,11 +427,6 @@ GEM
       addressable (>= 2.8.0)
       crack (>= 0.3.2)
       hashdiff (>= 0.4.0, < 2.0.0)
-    webpacker (5.4.4)
-      activesupport (>= 5.2)
-      rack-proxy (>= 0.6.1)
-      railties (>= 5.2)
-      semantic_range (>= 2.3.0)
     webrick (1.8.1)
     websocket (1.2.9)
     websocket-driver (0.7.5)
@@ -472,6 +466,7 @@ DEPENDENCIES
   jbuilder (~> 2.5)
   jquery-rails
   jquery-tablesorter
+  jsbundling-rails
   kramdown
   launchy
   listen
@@ -505,7 +500,6 @@ DEPENDENCIES
   uglifier (>= 1.3.0)
   web-console (>= 3.3.0)
   webmock
-  webpacker
 
 RUBY VERSION
    ruby 3.2.2p53

diff --git a/Procfile b/Procfile
@@ -1,4 +1,2 @@
 release: POSTGRES_STATEMENT_TIMEOUT=90s bin/rails heroku:release
 web: bin/rails server
-webpack: bin/webpack-dev-server
-worker: bin/que
diff --git a/Procfile.dev b/Procfile.dev
@@ -0,0 +1,2 @@
+web: unset PORT && bin/rails server
+js: yarn build --watch
diff --git a/app/assets/builds/.keep b/app/assets/builds/.keep
diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js
@@ -1,3 +1,4 @@
 //= link_tree ../images
 //= link_directory ../javascripts .js
 //= link_directory ../stylesheets .css
+//= link_tree ../builds
diff --git a/app/assets/javascripts/application.coffee → app/assets/javascripts/sprockets.coffee b/app/assets/javascripts/application.coffee → app/assets/javascripts/sprockets.coffee
@@ -23,4 +23,4 @@ $ ->
   $('[data-toggle="tooltip"]').tooltip()
 
   $('.tablesorter').tablesorter
-    textAttribute: 'data-sort-value'
+    textAttribute: 'data-sort-value'
diff --git a/app/javascript/application.js b/app/javascript/application.js
@@ -0,0 +1,6 @@
+import { Application } from 'stimulus';
+
+import CitiesController from './controllers/cities_controller';
+
+window.Stimulus = Application.start();
+Stimulus.register('cities', CitiesController);
diff --git a/...pt/packs/controllers/cities_controller.js → ...vascript/controllers/cities_controller.js b/...pt/packs/controllers/cities_controller.js → ...vascript/controllers/cities_controller.js
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
diff --git a/app/views/layouts/application.html.slim b/app/views/layouts/application.html.slim
@@ -5,8 +5,8 @@ html lang='en'
     title= content_for?(:meta_title) ? yield(:meta_title) : 'Open311 Status'
     meta name="description" content=(content_for?(:meta_description) ? yield(:meta_description) : "Open311 Status monitors and aggregates the status of dozens of Open311 API endpoints, providing benchmarks and comparative insights.")
     = stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true
+    = javascript_include_tag 'sprockets', 'data-turbolinks-track' => true
     = javascript_include_tag 'application', 'data-turbolinks-track' => true
-    = javascript_pack_tag 'application'
     = csrf_meta_tags
     - if content_for? :canonical_url
       link ref="canonical" href=yield(:canonical_url)

diff --git a/babel.config.js b/babel.config.js
diff --git a/bin/dev b/bin/dev
@@ -0,0 +1,8 @@
+#!/usr/bin/env sh
+
+if ! gem list foreman -i --silent; then
+  echo "Installing foreman..."
+  gem install foreman
+fi
+
+exec foreman start -f Procfile.dev "$@"
diff --git a/bin/lint b/bin/lint
@@ -18,12 +18,6 @@ FileUtils.chdir APP_ROOT do
   puts "\n== Running Rubocop =="
   system! "bundle exec rubocop #{options[:nofix] ? '--parallel' : '--autocorrect'}"
 
-  puts "\n== Running ES Lint =="
-  system! "yarn run eslint #{options[:nofix] ? '' : '--fix'} app/javascript"
-
   puts "\n== Slim Lint =="
   system! 'bundle exec slim-lint app/views/'
-
-  puts "\n== Stylelint =="
-  system! "yarn run stylelint --ignore-pattern=\"app/assets/stylesheets/vendor/*\" #{options[:nofix] ? '' : '--fix'} app/assets/stylesheets"
 end
diff --git a/bin/webpack b/bin/webpack
diff --git a/bin/webpack-dev-server b/bin/webpack-dev-server
diff --git a/config/webpack/development.js b/config/webpack/development.js
diff --git a/config/webpack/environment.js b/config/webpack/environment.js
diff --git a/config/webpack/production.js b/config/webpack/production.js
diff --git a/config/webpack/test.js b/config/webpack/test.js