upgrade webpack to shakapacker

.gitignore

@@ -59,3 +59,10 @@ yarn-debug.log*
 
 /config/credentials.yml.enc
 /config/master.key
+
+/public/packs
+/public/packs-test
+/node_modules
+/yarn-error.log
+yarn-debug.log*
+.yarn-integrity

Gemfile

@@ -20,7 +20,7 @@ gem 'awesome_nested_set'
 gem 'ransack', '~> 4.1.0'
 gem 'responders'
 gem 'rexml'
-gem 'webpacker', '~> 5'
+gem 'webpacker', '6.0.0.rc.6'
 
 gem 'i18n'
 gem 'i18n-js', '~> 3.9.0'

Gemfile.lock

@@ -515,7 +515,7 @@ GEM
     rack-protection (3.2.0)
       base64 (>= 0.1.0)
       rack (~> 2.2, >= 2.2.4)
-    rack-proxy (0.7.6)
+    rack-proxy (0.7.7)
       rack
     rack-rewrite (1.5.1)
     rack-test (2.1.0)
@@ -782,7 +782,7 @@ GEM
       addressable (>= 2.8.0)
       crack (>= 0.3.2)
       hashdiff (>= 0.4.0, < 2.0.0)
-    webpacker (5.4.4)
+    webpacker (6.0.0.rc.6)
       activesupport (>= 5.2)
       rack-proxy (>= 0.6.1)
       railties (>= 5.2)
@@ -937,7 +937,7 @@ DEPENDENCIES
   web!
   web-console
   webmock
-  webpacker (~> 5)
+  webpacker (= 6.0.0.rc.6)
   whenever
   wicked_pdf
   wkhtmltopdf-binary

bin/yarn

@@ -1,9 +1,14 @@
 #!/usr/bin/env ruby
 APP_ROOT = File.expand_path('..', __dir__)
 Dir.chdir(APP_ROOT) do
-  begin
-    exec "yarnpkg", *ARGV
-  rescue Errno::ENOENT
+  yarn = ENV["PATH"].split(File::PATH_SEPARATOR).
+    select { |dir| File.expand_path(dir) != __dir__ }.
+    product(["yarn", "yarnpkg", "yarn.cmd", "yarn.ps1"]).
+    map { |dir, file| File.expand_path(file, dir) }.
+    find { |file| File.executable?(file) }
+  if yarn
+    exec yarn, *ARGV
+  else
     $stderr.puts "Yarn executable was not detected in the system."
     $stderr.puts "Download Yarn at https://yarnpkg.com/en/docs/install"
     exit 1

config/webpack/base.js

@@ -0,0 +1,9 @@
+const { webpackConfig, merge } = require('@rails/webpacker')
+
+const extensions = {
+  resolve: {
+    extensions: [".mjs",".js",".sass",".scss",".css",".module.sass,",".module.scss,",".module.css",".png",".svg",".gif",".jpeg",".jpg",".eot",".ttf",".woff"]
+  }
+}
+
+module.exports = merge( webpackConfig, extensions)

config/webpack/development.js

@@ -1,5 +1,5 @@
 process.env.NODE_ENV = process.env.NODE_ENV || 'development'
 
-const environment = require('./environment')
+const webpackConfig = require('./base')
 
-module.exports = environment.toWebpackConfig()
+module.exports = webpackConfig

config/webpack/production.js

@@ -1,5 +1,5 @@
 process.env.NODE_ENV = process.env.NODE_ENV || 'production'
 
-const environment = require('./environment')
+const webpackConfig = require('./base')
 
-module.exports = environment.toWebpackConfig()
+module.exports = webpackConfig

config/webpack/test.js

@@ -1,5 +1,5 @@
 process.env.NODE_ENV = process.env.NODE_ENV || 'development'
 
-const environment = require('./environment')
+const webpackConfig = require('./base')
 
-module.exports = environment.toWebpackConfig()
+module.exports = webpackConfig

config/webpacker.yml

@@ -2,13 +2,13 @@
 
 default: &default
   source_path: app/webpacker
-  source_entry_path: packs
+  source_entry_path: /
   public_root_path: public
   public_output_path: packs
   cache_path: tmp/cache/webpacker
   webpack_compile_output: true
 
-  # Additional paths webpack should lookup modules
+  # Additional paths webpack should look up modules
   # ['app/assets', 'engine/foo/app/assets']
   additional_paths: [
     'vendor',
@@ -39,24 +39,6 @@ default: &default
     - .woff
     - .woff2
 
-  extensions:
-    - .mjs
-    - .js
-    - .sass
-    - .scss
-    - .css
-    - .module.sass
-    - .module.scss
-    - .module.css
-    - .png
-    - .svg
-    - .gif
-    - .jpeg
-    - .jpg
-    - .eot
-    - .ttf
-    - .woff
-
 development:
   <<: *default
   compile: true
@@ -66,22 +48,31 @@ development:
     https: false
     host: localhost
     port: 3035
-    public: localhost:3035
+    # Hot Module Replacement updates modules while the application is running without a full reload
     hmr: false
-    # Inline should be set to true if using HMR
-    inline: true
-    overlay: true
+    # Defaults to the inverse of hmr. Uncomment to manually set this.
+    # live_reload: true
+    client:
+      # Should we show a full-screen overlay in the browser when there are compiler errors or warnings?
+      overlay: true
+      # May also be a string
+      # webSocketURL:
+      #  hostname: "0.0.0.0"
+      #  pathname: "/ws"
+      #  port: 8080
+    # Should we use gzip compression?
     compress: true
     disable_host_check: true
     use_local_ip: false
     quiet: false
     pretty: false
     headers:
       'Access-Control-Allow-Origin': '*'
-    watch_options:
-      ignored:
-        - '**/node_modules/**'
-        - '**/*.swp'
+    static:
+      watch:
+        ignored: 
+          - '**/node_modules/**'
+          - '**/*.swp'
 
 production: &production
   <<: *default

package.json

@@ -20,7 +20,7 @@
   "dependencies": {
     "@floating-ui/dom": "^1.6.3",
     "@hotwired/turbo": "^8.0.2",
-    "@rails/webpacker": "5.4.4",
+    "@rails/webpacker": "6.0.0-rc.6",
     "cable_ready": "5.0.2",
     "debounced": "^0.0.5",
     "flatpickr": "^4.6.9",
@@ -38,7 +38,7 @@
     "stimulus_reflex": "3.5.0-rc3",
     "tom-select": "^2.3.1",
     "trix": "^2.0.10",
-    "webpack": "~4"
+    "webpack": "^5.90.3"
   },
   "devDependencies": {
     "jasmine-core": "~5.1.2",
@@ -49,6 +49,11 @@
     "karma-jasmine": "~0.3.8",
     "prettier": "3.2.4",
     "pretty-quick": "4.0.0",
-    "webpack-dev-server": "~3"
-  }
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^5.0.2"
+  },
+  "browserslist": [
+    "defaults",
+    "IE 11"
+  ]
 }