webpack5

.eslintrc.js

@@ -21,6 +21,10 @@ module.exports = {
     'generator-star-spacing': 0,
     // allow debugger during development
     'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'vue/require-prop-types': 0
+    'vue/require-prop-types': 0,
+    'vue/v-slot-style': 0,
+    'vue/component-definition-name-casing': 0,
+    'vue/no-lone-template': 0,
+    'vue/component-tags-order': 0
   }
 }

build/dev-server.js

@@ -29,18 +29,6 @@ var devMiddleware = require('webpack-dev-middleware')(compiler, {
 })
 
 var hotMiddleware = require('webpack-hot-middleware')(compiler)
-// force page reload when html-webpack-plugin template changes
-compiler.plugin('compilation', function (compilation) {
-  compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
-    // FIXME: This supposed to reload whole page when index.html is changed,
-    // however now it reloads entire page on every breath, i suppose the order
-    // of plugins changed or something. It's a minor thing and douesn't hurt
-    // disabling it, constant reloads hurt much more
-
-    // hotMiddleware.publish({ action: 'reload' })
-    // cb()
-  })
-})
 
 // proxy api requests
 Object.keys(proxyTable).forEach(function (context) {

build/webpack.base.conf.js

@@ -16,7 +16,8 @@ var now = Date.now()
 
 module.exports = {
   entry: {
-    app: './src/main.js'
+    app: './src/main.js',
+    'sw-pleroma': './src/sw.js'
   },
   output: {
     path: config.build.assetsRoot,
@@ -91,10 +92,10 @@ module.exports = {
     ]
   },
   plugins: [
-    new ServiceWorkerWebpackPlugin({
-      entry: path.join(__dirname, '..', 'src/sw.js'),
-      filename: 'sw-pleroma.js'
-    }),
+    // new ServiceWorkerWebpackPlugin({
+    //   entry: path.join(__dirname, '..', 'src/sw.js'),
+    //   filename: 'sw-pleroma.js'
+    // }),
     // This copies Ruffle's WASM to a directory so that JS side can access it
     new CopyPlugin({
       patterns: [

build/webpack.dev.conf.js

@@ -16,7 +16,7 @@ module.exports = merge(baseWebpackConfig, {
   },
   mode: 'development',
   // eval-source-map is faster for development
-  devtool: '#eval-source-map',
+  devtool: 'eval-source-map',
   plugins: [
     new webpack.DefinePlugin({
       'process.env': config.dev.env,

build/webpack.prod.conf.js

@@ -19,7 +19,7 @@ var webpackConfig = merge(baseWebpackConfig, {
   module: {
     rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, extract: true })
   },
-  devtool: config.build.productionSourceMap ? '#source-map' : false,
+  devtool: config.build.productionSourceMap ? 'source-map' : undefined,
   optimization: {
     minimize: true,
     splitChunks: {

package.json

@@ -60,22 +60,22 @@
     "connect-history-api-fallback": "^1.1.0",
     "copy-webpack-plugin": "^6.4.1",
     "cross-spawn": "^4.0.2",
-    "css-loader": "^0.28.0",
+    "css-loader": "^5.0.0",
     "custom-event-polyfill": "^1.0.7",
-    "eslint": "^5.16.0",
+    "eslint": "^6.00.0",
     "eslint-config-standard": "^12.0.0",
     "eslint-friendly-formatter": "^2.0.5",
-    "eslint-loader": "^2.1.0",
+    "eslint-loader": "^4.0.0",
     "eslint-plugin-import": "^2.13.0",
     "eslint-plugin-node": "^7.0.0",
     "eslint-plugin-promise": "^4.0.0",
     "eslint-plugin-standard": "^4.0.0",
-    "eslint-plugin-vue": "^5.2.2",
+    "eslint-plugin-vue": "^7.10.0",
     "eventsource-polyfill": "^0.9.6",
     "express": "^4.13.3",
-    "file-loader": "^3.0.1",
+    "file-loader": "^6.2.0",
     "function-bind": "^1.0.2",
-    "html-webpack-plugin": "^3.0.0",
+    "html-webpack-plugin": "^5.0.0",
     "http-proxy-middleware": "^0.17.2",
     "inject-loader": "^2.0.1",
     "iso-639-1": "^2.0.3",
@@ -89,10 +89,10 @@
     "karma-sinon-chai": "^2.0.2",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-spec-reporter": "0.0.26",
-    "karma-webpack": "^4.0.0-rc.3",
+    "karma-webpack": "^5.0.0",
     "lodash": "^4.16.4",
     "lolex": "^1.4.0",
-    "mini-css-extract-plugin": "^0.5.0",
+    "mini-css-extract-plugin": "^1.6.0",
     "mocha": "^3.1.0",
     "nightwatch": "^0.9.8",
     "opn": "^4.0.2",
@@ -110,11 +110,12 @@
     "stylelint": "^13.6.1",
     "stylelint-config-standard": "^20.0.0",
     "stylelint-rscss": "^0.4.0",
-    "url-loader": "^1.1.2",
+    "url": "^0.11.0",
+    "url-loader": "^4.1.1",
     "vue-loader": "^14.0.0",
     "vue-style-loader": "^4.0.0",
-    "webpack": "^4.44.0",
-    "webpack-dev-middleware": "^3.6.0",
+    "webpack": "^5.38.0",
+    "webpack-dev-middleware": "^5.0.0",
     "webpack-hot-middleware": "^2.12.2",
     "webpack-merge": "^0.14.1"
   },

src/services/push/push.js

@@ -1,5 +1,3 @@
-import runtime from 'serviceworker-webpack-plugin/lib/runtime'
-
 function urlBase64ToUint8Array (base64String) {
   const padding = '='.repeat((4 - base64String.length % 4) % 4)
   const base64 = (base64String + padding)
@@ -15,7 +13,7 @@ function isPushSupported () {
 }
 
 function getOrCreateServiceWorker () {
-  return runtime.register()
+  return navigator.serviceWorker.register('/sw-pleroma.js')
     .catch((err) => console.error('Unable to get or create a service worker.', err))
 }