diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 8f55b4b5..0c7fa08a 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -38,7 +38,7 @@
   "features": {
     "ghcr.io/devcontainers/features/common-utils:2": {
       "configureZshAsDefaultShell": true,
-      "nonFreePackages": true
+      "nonFreePackages": false
     },
     "ghcr.io/devcontainers/features/github-cli:1": {
       "installDirectlyFromGitHubRelease": true,
diff --git a/Gemfile b/Gemfile
index 35093105..370a0b99 100644
--- a/Gemfile
+++ b/Gemfile
@@ -41,7 +41,7 @@ end
 
 group :development do
   gem 'web-console', '>= 3.3.0'
-  gem 'listen', '>= 3.0.5', '< 3.2'
+  gem 'listen', '~> 3.8'
   gem 'spring', '~> 4.1', '>= 4.1.1'
   gem 'spring-watcher-listen', '~> 2.1'
   gem 'better_errors', '~> 2.5'
diff --git a/Gemfile.lock b/Gemfile.lock
index f1822abb..08aa0bf0 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -134,7 +134,7 @@ GEM
     factory_bot_rails (5.2.0)
       factory_bot (~> 5.2.0)
       railties (>= 4.2.0)
-    ffi (1.15.5)
+    ffi (1.16.2)
     gemoji (4.1.0)
     globalid (1.1.0)
       activesupport (>= 5.0)
@@ -149,9 +149,9 @@ GEM
     jsonapi-renderer (0.2.2)
     jwt (2.7.1)
     language_server-protocol (3.17.0.3)
-    listen (3.0.8)
-      rb-fsevent (~> 0.9, >= 0.9.4)
-      rb-inotify (~> 0.9, >= 0.9.7)
+    listen (3.8.0)
+      rb-fsevent (~> 0.10, >= 0.10.3)
+      rb-inotify (~> 0.9, >= 0.9.10)
     loofah (2.21.3)
       crass (~> 1.0.2)
       nokogiri (>= 1.12.0)
@@ -381,7 +381,7 @@ DEPENDENCIES
   factory_bot_rails (~> 5.1)
   gemoji
   jwt (~> 2.7, >= 2.7.1)
-  listen (>= 3.0.5, < 3.2)
+  listen (~> 3.8)
   memoist (~> 0.16.0)
   meta-tags (~> 2.11, >= 2.11.1)
   pg (~> 1.5, >= 1.5.3)
diff --git a/app/views/application/_head.erb b/app/views/application/_head.erb
index b17fe3b0..2a17694c 100644
--- a/app/views/application/_head.erb
+++ b/app/views/application/_head.erb
@@ -36,5 +36,5 @@
 
   <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
   <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
-  <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
+  <%= javascript_pack_tag 'rails', 'bootstrap', 'application', 'data-turbolinks-track': 'reload' %>
 </head>
diff --git a/app/webpack/packs/application.js b/app/webpack/packs/application.js
index 06592a35..1f236af6 100644
--- a/app/webpack/packs/application.js
+++ b/app/webpack/packs/application.js
@@ -1,11 +1,5 @@
 import '../stylesheets/application.scss';
 
-import Rails from '@rails/ujs';
-import Turbolinks from 'turbolinks';
-import 'bootstrap/dist/js/bootstrap';
-import 'bootstrap-select';
-import 'data-confirm-modal';
-
 import Vue from 'vue/dist/vue.esm';
 import TurbolinksAdapter from 'vue-turbolinks';
 
@@ -14,9 +8,6 @@ import Profile from '../components/user_profile/profile.vue';
 import CookieLaw from '../components/cookie_law/cookie_law.vue';
 import LeaveSite from '../components/leave_site/leave_site.vue';
 
-Rails.start();
-Turbolinks.start();
-
 Vue.use(TurbolinksAdapter);
 
 import '../vue-rollbar.js.erb'; // eslint-disable-line import/first
diff --git a/app/webpack/packs/bootstrap.js b/app/webpack/packs/bootstrap.js
new file mode 100644
index 00000000..b900da3c
--- /dev/null
+++ b/app/webpack/packs/bootstrap.js
@@ -0,0 +1,3 @@
+import 'bootstrap';
+import 'bootstrap-select';
+import 'data-confirm-modal';
diff --git a/app/webpack/packs/rails.js b/app/webpack/packs/rails.js
new file mode 100644
index 00000000..d62baddb
--- /dev/null
+++ b/app/webpack/packs/rails.js
@@ -0,0 +1,5 @@
+import Rails from '@rails/ujs';
+import Turbolinks from 'turbolinks';
+
+Rails.start();
+Turbolinks.start();