diff --git a/scripts/webpack/sw.js b/scripts/webpack/sw.js
new file mode 100644
index 0000000000..5ca2706a05
--- /dev/null
+++ b/scripts/webpack/sw.js
@@ -0,0 +1,15 @@
+// https://github.com/NekR/self-destroying-sw
+self.addEventListener('install', function() {
+  self.skipWaiting()
+})
+
+self.addEventListener('activate', function() {
+  self.registration
+    .unregister()
+    .then(function() {
+      return self.clients.matchAll()
+    })
+    .then(function(clients) {
+      clients.forEach(client => client.navigate(client.url))
+    })
+})
diff --git a/scripts/webpack/webpack.base.prod.js b/scripts/webpack/webpack.base.prod.js
index 32c19245ee..33d31ba4ec 100644
--- a/scripts/webpack/webpack.base.prod.js
+++ b/scripts/webpack/webpack.base.prod.js
@@ -16,6 +16,18 @@ const hashOfCommit = getRef()
 const APP_VERSION = `${tagName.packageName}_${tagName.version}`
 const outputFileName = `[name].${hashOfCommit}.js`
 
+/**
+ * https://medium.com/@nekrtemplar/self-destroying-serviceworker-73d62921d717
+ * https://github.com/reapit/foundations/issues/1419
+ * using this method: https://github.com/NekR/self-destroying-sw
+ * To clean up service worker for users who has installed it
+ *
+ * TODO:
+ * remove after users stop experiencing errors which relevant to service worker like this:
+ * https://sentry.io/organizations/reapit-ltd/issues/1692085300/?project=1885603&referrer=slack
+ */
+const serviceWorkerPath = path.resolve(__dirname, './sw.js')
+
 const webpackConfig = {
   mode: 'production',
   bail: true,
@@ -26,6 +38,13 @@ const webpackConfig = {
     filename: outputFileName,
   },
   plugins: [
+    new CopyPlugin([
+      {
+        from: serviceWorkerPath,
+        to: './sw.js',
+        force: true,
+      },
+    ]),
     new ResolveTSPathsToWebpackAlias({
       tsconfig: PATHS.tsConfig,
     }),