diff --git a/client/components/App.vue b/client/components/App.vue
index a83c0f4d..e4937629 100644
--- a/client/components/App.vue
+++ b/client/components/App.vue
@@ -11,9 +11,9 @@
 </template>
 
 <script>
-const throttle = require("lodash/throttle");
-const constants = require("../js/constants");
-const storage = require("../js/localStorage");
+import throttle from "lodash/throttle";
+import constants from "../js/constants";
+import storage from "../js/localStorage";
 
 import Sidebar from "./Sidebar.vue";
 import ImageViewer from "./ImageViewer.vue";
diff --git a/client/components/Channel.vue b/client/components/Channel.vue
index 82084419..a533473f 100644
--- a/client/components/Channel.vue
+++ b/client/components/Channel.vue
@@ -25,7 +25,7 @@
 </template>
 
 <script>
-const roundBadgeNumber = require("../js/helpers/roundBadgeNumber");
+import roundBadgeNumber from "../js/helpers/roundBadgeNumber";
 import ChannelWrapper from "./ChannelWrapper.vue";
 
 export default {
diff --git a/client/components/ChatInput.vue b/client/components/ChatInput.vue
index a3cec599..b23b2515 100644
--- a/client/components/ChatInput.vue
+++ b/client/components/ChatInput.vue
@@ -48,12 +48,12 @@
 </template>
 
 <script>
+import Mousetrap from "mousetrap";
+import {wrapCursor} from "undate";
 import autocompletion from "../js/autocompletion";
-const commands = require("../js/commands/index");
-const socket = require("../js/socket");
-const upload = require("../js/upload");
-const Mousetrap = require("mousetrap");
-const {wrapCursor} = require("undate");
+import commands from "../js/commands/index";
+import socket from "../js/socket";
+import upload from "../js/upload";
 
 const formattingHotkeys = {
 	"mod+k": "\x03",
diff --git a/client/components/ChatUserList.vue b/client/components/ChatUserList.vue
index 5aeaffe3..69371591 100644
--- a/client/components/ChatUserList.vue
+++ b/client/components/ChatUserList.vue
@@ -51,7 +51,7 @@
 </template>
 
 <script>
-const fuzzy = require("fuzzy");
+import {filter as fuzzyFilter} from "fuzzy";
 import Username from "./Username.vue";
 import UsernameFiltered from "./UsernameFiltered.vue";
 import {generateUserContextMenu} from "../js/helpers/contextMenu.js";
@@ -85,7 +85,7 @@ export default {
 		// filteredUsers is computed, to avoid unnecessary filtering
 		// as it is shared between filtering and keybindings.
 		filteredUsers() {
-			return fuzzy.filter(this.userSearchInput, this.channel.users, {
+			return fuzzyFilter(this.userSearchInput, this.channel.users, {
 				pre: "<b>",
 				post: "</b>",
 				extract: (u) => u.nick,
diff --git a/client/components/ContextMenu.vue b/client/components/ContextMenu.vue
index c69565cc..fc64b88d 100644
--- a/client/components/ContextMenu.vue
+++ b/client/components/ContextMenu.vue
@@ -19,7 +19,7 @@
 </template>
 
 <script>
-const Mousetrap = require("mousetrap");
+import Mousetrap from "mousetrap";
 
 export default {
 	name: "ContextMenu",
diff --git a/client/components/InlineChannel.vue b/client/components/InlineChannel.vue
index daab67f7..2a1478cf 100644
--- a/client/components/InlineChannel.vue
+++ b/client/components/InlineChannel.vue
@@ -5,7 +5,7 @@
 </template>
 
 <script>
-const socket = require("../js/socket");
+import socket from "../js/socket";
 
 export default {
 	name: "InlineChannel",
diff --git a/client/components/LinkPreview.vue b/client/components/LinkPreview.vue
index 841e4779..9637760f 100644
--- a/client/components/LinkPreview.vue
+++ b/client/components/LinkPreview.vue
@@ -107,7 +107,7 @@
 </template>
 
 <script>
-const friendlysize = require("../js/helpers/friendlysize");
+import friendlysize from "../js/helpers/friendlysize";
 
 export default {
 	name: "LinkPreview",
diff --git a/client/components/LinkPreviewFileSize.vue b/client/components/LinkPreviewFileSize.vue
index 3e2b0179..4fa03bc6 100644
--- a/client/components/LinkPreviewFileSize.vue
+++ b/client/components/LinkPreviewFileSize.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script>
-const constants = require("../js/constants");
+import constants from "../js/constants";
 
 export default {
 	name: "LinkPreviewFileSize",
diff --git a/client/components/Message.vue b/client/components/Message.vue
index 8229cca9..3afefaa3 100644
--- a/client/components/Message.vue
+++ b/client/components/Message.vue
@@ -75,8 +75,7 @@ import LinkPreview from "./LinkPreview.vue";
 import ParsedMessage from "./ParsedMessage.vue";
 import MessageTypes from "./MessageTypes";
 import {generateUserContextMenu} from "../js/helpers/contextMenu.js";
-
-const constants = require("../js/constants");
+import constants from "../js/constants";
 
 MessageTypes.ParsedMessage = ParsedMessage;
 MessageTypes.LinkPreview = LinkPreview;
diff --git a/client/components/MessageCondensed.vue b/client/components/MessageCondensed.vue
index 5b504fce..b3897e8f 100644
--- a/client/components/MessageCondensed.vue
+++ b/client/components/MessageCondensed.vue
@@ -18,7 +18,7 @@
 </template>
 
 <script>
-const constants = require("../js/constants");
+import constants from "../js/constants";
 import Message from "./Message.vue";
 
 export default {
diff --git a/client/components/MessageList.vue b/client/components/MessageList.vue
index 561cbdac..6d811442 100644
--- a/client/components/MessageList.vue
+++ b/client/components/MessageList.vue
@@ -56,8 +56,8 @@
 <script>
 require("intersection-observer");
 
-const constants = require("../js/constants");
-const clipboard = require("../js/clipboard");
+import constants from "../js/constants";
+import clipboard from "../js/clipboard";
 import socket from "../js/socket";
 import Message from "./Message.vue";
 import MessageCondensed from "./MessageCondensed.vue";
diff --git a/client/components/MessageTypes/index.js b/client/components/MessageTypes/index.js
index e595a33a..4d873bd6 100644
--- a/client/components/MessageTypes/index.js
+++ b/client/components/MessageTypes/index.js
@@ -6,7 +6,7 @@
 // Second argument says it's recursive, third makes sure we only load templates.
 const requireViews = require.context(".", false, /\.vue$/);
 
-module.exports = requireViews.keys().reduce((acc, path) => {
+export default requireViews.keys().reduce((acc, path) => {
 	acc["message-" + path.substring(2, path.length - 4)] = requireViews(path).default;
 
 	return acc;
diff --git a/client/components/NetworkLobby.vue b/client/components/NetworkLobby.vue
index f7538f2a..2e859c4f 100644
--- a/client/components/NetworkLobby.vue
+++ b/client/components/NetworkLobby.vue
@@ -47,10 +47,10 @@
 </template>
 
 <script>
-const roundBadgeNumber = require("../js/helpers/roundBadgeNumber");
+import roundBadgeNumber from "../js/helpers/roundBadgeNumber";
 import ChannelWrapper from "./ChannelWrapper.vue";
 import socket from "../js/socket";
-const storage = require("../js/localStorage");
+import storage from "../js/localStorage";
 
 export default {
 	name: "Channel",
diff --git a/client/components/ParsedMessage.vue b/client/components/ParsedMessage.vue
index c125f193..52538a9a 100644
--- a/client/components/ParsedMessage.vue
+++ b/client/components/ParsedMessage.vue
@@ -1,5 +1,5 @@
 <script>
-const parse = require("../js/helpers/parse");
+import parse from "../js/helpers/parse";
 
 export default {
 	name: "ParsedMessage",
diff --git a/client/components/Session.vue b/client/components/Session.vue
index 09328726..e10d8951 100644
--- a/client/components/Session.vue
+++ b/client/components/Session.vue
@@ -28,8 +28,8 @@
 </template>
 
 <script>
-const Auth = require("../js/auth");
-const socket = require("../js/socket");
+import Auth from "../js/auth";
+import socket from "../js/socket";
 
 export default {
 	name: "Session",
diff --git a/client/components/Username.vue b/client/components/Username.vue
index bbf52051..20629fca 100644
--- a/client/components/Username.vue
+++ b/client/components/Username.vue
@@ -10,7 +10,7 @@
 </template>
 
 <script>
-const colorClass = require("../js/helpers/colorClass");
+import colorClass from "../js/helpers/colorClass";
 
 export default {
 	name: "Username",
diff --git a/client/components/UsernameFiltered.vue b/client/components/UsernameFiltered.vue
index 1f50c364..b1588831 100644
--- a/client/components/UsernameFiltered.vue
+++ b/client/components/UsernameFiltered.vue
@@ -10,7 +10,7 @@
 </template>
 
 <script>
-const colorClass = require("../js/helpers/colorClass");
+import colorClass from "../js/helpers/colorClass";
 
 export default {
 	name: "UsernameFiltered",
diff --git a/client/components/VersionChecker.vue b/client/components/VersionChecker.vue
index dc2ad602..d9c390f1 100644
--- a/client/components/VersionChecker.vue
+++ b/client/components/VersionChecker.vue
@@ -44,7 +44,7 @@
 </template>
 
 <script>
-const socket = require("../js/socket");
+import socket from "../js/socket";
 
 export default {
 	name: "VersionChecker",
diff --git a/client/components/Windows/Connect.vue b/client/components/Windows/Connect.vue
index 3e1feb9b..46120931 100644
--- a/client/components/Windows/Connect.vue
+++ b/client/components/Windows/Connect.vue
@@ -3,8 +3,7 @@
 </template>
 
 <script>
-const socket = require("../../js/socket");
-
+import socket from "../../js/socket";
 import NetworkForm from "../NetworkForm.vue";
 
 export default {
diff --git a/client/components/Windows/NetworkEdit.vue b/client/components/Windows/NetworkEdit.vue
index 17d2dc5d..e0bc4899 100644
--- a/client/components/Windows/NetworkEdit.vue
+++ b/client/components/Windows/NetworkEdit.vue
@@ -8,7 +8,7 @@
 </template>
 
 <script>
-const socket = require("../../js/socket");
+import socket from "../../js/socket";
 import NetworkForm from "../NetworkForm.vue";
 
 export default {
diff --git a/client/components/Windows/SignIn.vue b/client/components/Windows/SignIn.vue
index 055b2d88..0d95ced9 100644
--- a/client/components/Windows/SignIn.vue
+++ b/client/components/Windows/SignIn.vue
@@ -56,7 +56,7 @@
 </template>
 
 <script>
-const storage = require("../../js/localStorage");
+import storage from "../../js/localStorage";
 import socket from "../../js/socket";
 import RevealPassword from "../RevealPassword.vue";
 
diff --git a/client/js/auth.js b/client/js/auth.js
index 5d8982fb..308031fd 100644
--- a/client/js/auth.js
+++ b/client/js/auth.js
@@ -1,11 +1,11 @@
 "use strict";
 
-const localStorage = require("./localStorage");
-const location = require("./location");
+import storage from "./localStorage";
+import location from "./location";
 
-module.exports = class Auth {
+export default class Auth {
 	static signout() {
-		localStorage.clear();
+		storage.clear();
 		location.reload();
 	}
-};
+}
diff --git a/client/js/autocompletion.js b/client/js/autocompletion.js
index cbaaaf6a..1b281563 100644
--- a/client/js/autocompletion.js
+++ b/client/js/autocompletion.js
@@ -1,11 +1,12 @@
 "use strict";
 
-const fuzzy = require("fuzzy");
-const Mousetrap = require("mousetrap");
-const {Textcomplete, Textarea} = require("textcomplete");
-const emojiMap = require("./helpers/simplemap.json");
-const constants = require("./constants");
-const store = require("./store").default;
+import Mousetrap from "mousetrap";
+import {Textcomplete, Textarea} from "textcomplete";
+import fuzzy from "fuzzy";
+
+import emojiMap from "./helpers/simplemap.json";
+import constants from "./constants";
+import store from "./store";
 
 export default enableAutocomplete;
 
diff --git a/client/js/clipboard.js b/client/js/clipboard.js
index a2db3586..0b1bc986 100644
--- a/client/js/clipboard.js
+++ b/client/js/clipboard.js
@@ -1,6 +1,6 @@
 "use strict";
 
-module.exports = function(chat) {
+export default function(chat) {
 	// Disable in Firefox as it already copies flex text correctly
 	if (typeof window.InstallTrigger !== "undefined") {
 		return;
@@ -28,4 +28,4 @@ module.exports = function(chat) {
 		selection.removeAllRanges();
 		selection.addRange(range);
 	}, 0);
-};
+}
diff --git a/client/js/commands/collapse.js b/client/js/commands/collapse.js
index 359c9dc0..0645898a 100644
--- a/client/js/commands/collapse.js
+++ b/client/js/commands/collapse.js
@@ -1,9 +1,9 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
-exports.input = function() {
+function input() {
 	const messageIds = [];
 
 	for (const message of store.state.activeChannel.channel.messages) {
@@ -31,4 +31,6 @@ exports.input = function() {
 	}
 
 	return true;
-};
+}
+
+export default {input};
diff --git a/client/js/commands/expand.js b/client/js/commands/expand.js
index 3e44951a..b59b15be 100644
--- a/client/js/commands/expand.js
+++ b/client/js/commands/expand.js
@@ -1,9 +1,9 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
-exports.input = function() {
+function input() {
 	const messageIds = [];
 
 	for (const message of store.state.activeChannel.channel.messages) {
@@ -31,4 +31,6 @@ exports.input = function() {
 	}
 
 	return true;
-};
+}
+
+export default {input};
diff --git a/client/js/commands/index.js b/client/js/commands/index.js
index f6f313c8..554c7ab0 100644
--- a/client/js/commands/index.js
+++ b/client/js/commands/index.js
@@ -8,14 +8,14 @@
 // Second argument says it's recursive, third makes sure we only load javascript.
 const commands = require.context("./", true, /\.js$/);
 
-module.exports = commands.keys().reduce((acc, path) => {
+export default commands.keys().reduce((acc, path) => {
 	const command = path.substring(2, path.length - 3);
 
 	if (command === "index") {
 		return acc;
 	}
 
-	acc[command] = commands(path);
+	acc[command] = commands(path).default;
 
 	return acc;
 }, {});
diff --git a/client/js/commands/join.js b/client/js/commands/join.js
index acd3c4d8..dd62994e 100644
--- a/client/js/commands/join.js
+++ b/client/js/commands/join.js
@@ -1,10 +1,10 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
-const {switchToChannel} = require("../router");
+import socket from "../socket";
+import store from "../store";
+import {switchToChannel} from "../router";
 
-exports.input = function(args) {
+function input(args) {
 	if (args.length > 0) {
 		let channels = args[0];
 
@@ -44,4 +44,6 @@ exports.input = function(args) {
 
 		return true;
 	}
-};
+}
+
+export default {input};
diff --git a/client/js/constants.js b/client/js/constants.js
index 72985996..4ff328ec 100644
--- a/client/js/constants.js
+++ b/client/js/constants.js
@@ -29,7 +29,7 @@ const timeFormats = {
 
 const sizeUnits = ["B", "KiB", "MiB", "GiB", "TiB"];
 
-module.exports = {
+export default {
 	colorCodeMap,
 	commands: [],
 	condensedTypes,
diff --git a/client/js/helpers/colorClass.js b/client/js/helpers/colorClass.js
index 2339bc73..c327c0e3 100644
--- a/client/js/helpers/colorClass.js
+++ b/client/js/helpers/colorClass.js
@@ -1,7 +1,7 @@
 "use strict";
 
 // Generates a string from "color-1" to "color-32" based on an input string
-module.exports = function(str) {
+export default (str) => {
 	let hash = 0;
 
 	for (let i = 0; i < str.length; i++) {
diff --git a/client/js/helpers/contextMenu.js b/client/js/helpers/contextMenu.js
index 9f85e675..ef7cfd2a 100644
--- a/client/js/helpers/contextMenu.js
+++ b/client/js/helpers/contextMenu.js
@@ -1,4 +1,5 @@
 "use strict";
+
 import socket from "../socket";
 
 export function generateChannelContextMenu($root, channel, network) {
diff --git a/client/js/helpers/friendlysize.js b/client/js/helpers/friendlysize.js
index bd485f82..5400a440 100644
--- a/client/js/helpers/friendlysize.js
+++ b/client/js/helpers/friendlysize.js
@@ -2,7 +2,7 @@
 
 const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
 
-module.exports = function(size) {
+export default (size) => {
 	// Loosely inspired from https://stackoverflow.com/a/18650828/1935861
 	const i = size > 0 ? Math.floor(Math.log(size) / Math.log(1024)) : 0;
 	const fixedSize = parseFloat((size / Math.pow(1024, i)).toFixed(1));
diff --git a/client/js/helpers/ircmessageparser/anyIntersection.js b/client/js/helpers/ircmessageparser/anyIntersection.js
index 458c0333..557ad945 100644
--- a/client/js/helpers/ircmessageparser/anyIntersection.js
+++ b/client/js/helpers/ircmessageparser/anyIntersection.js
@@ -11,4 +11,4 @@ function anyIntersection(a, b) {
 	);
 }
 
-module.exports = anyIntersection;
+export default anyIntersection;
diff --git a/client/js/helpers/ircmessageparser/fill.js b/client/js/helpers/ircmessageparser/fill.js
index 564cf478..8ae271d4 100644
--- a/client/js/helpers/ircmessageparser/fill.js
+++ b/client/js/helpers/ircmessageparser/fill.js
@@ -32,4 +32,4 @@ function fill(existingEntries, text) {
 	return result;
 }
 
-module.exports = fill;
+export default fill;
diff --git a/client/js/helpers/ircmessageparser/findChannels.js b/client/js/helpers/ircmessageparser/findChannels.js
index d7a7385d..044dfcb9 100644
--- a/client/js/helpers/ircmessageparser/findChannels.js
+++ b/client/js/helpers/ircmessageparser/findChannels.js
@@ -3,7 +3,7 @@
 // Escapes the RegExp special characters "^", "$", "", ".", "*", "+", "?", "(",
 // ")", "[", "]", "{", "}", and "|" in string.
 // See https://lodash.com/docs/#escapeRegExp
-const escapeRegExp = require("lodash/escapeRegExp");
+import escapeRegExp from "lodash/escapeRegExp";
 
 // Given an array of channel prefixes (such as "#" and "&") and an array of user
 // modes (such as "@" and "+"), this function extracts channels and nicks from a
@@ -40,4 +40,4 @@ function findChannels(text, channelPrefixes, userModes) {
 	return result;
 }
 
-module.exports = findChannels;
+export default findChannels;
diff --git a/client/js/helpers/ircmessageparser/findEmoji.js b/client/js/helpers/ircmessageparser/findEmoji.js
index 93ba7cb6..4559c96f 100644
--- a/client/js/helpers/ircmessageparser/findEmoji.js
+++ b/client/js/helpers/ircmessageparser/findEmoji.js
@@ -17,4 +17,4 @@ function findEmoji(text) {
 	return result;
 }
 
-module.exports = findEmoji;
+export default findEmoji;
diff --git a/client/js/helpers/ircmessageparser/findNames.js b/client/js/helpers/ircmessageparser/findNames.js
index 5ce136b5..58fee254 100644
--- a/client/js/helpers/ircmessageparser/findNames.js
+++ b/client/js/helpers/ircmessageparser/findNames.js
@@ -25,4 +25,4 @@ function findNames(text, users) {
 	return result;
 }
 
-module.exports = findNames;
+export default findNames;
diff --git a/client/js/helpers/ircmessageparser/merge.js b/client/js/helpers/ircmessageparser/merge.js
index ce569f4a..5d22930b 100644
--- a/client/js/helpers/ircmessageparser/merge.js
+++ b/client/js/helpers/ircmessageparser/merge.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const anyIntersection = require("./anyIntersection");
-const fill = require("./fill");
+import anyIntersection from "./anyIntersection";
+import fill from "./fill";
 
 // Merge text part information within a styling fragment
 function assign(textPart, fragment) {
@@ -51,4 +51,4 @@ function merge(textParts, styleFragments, cleanText) {
 	});
 }
 
-module.exports = merge;
+export default merge;
diff --git a/client/js/helpers/ircmessageparser/parseStyle.js b/client/js/helpers/ircmessageparser/parseStyle.js
index 8a6734c3..e1671332 100644
--- a/client/js/helpers/ircmessageparser/parseStyle.js
+++ b/client/js/helpers/ircmessageparser/parseStyle.js
@@ -234,4 +234,4 @@ function prepare(text) {
 	);
 }
 
-module.exports = prepare;
+export default prepare;
diff --git a/client/js/helpers/localetime.js b/client/js/helpers/localetime.js
index b8ba600d..74b7546f 100644
--- a/client/js/helpers/localetime.js
+++ b/client/js/helpers/localetime.js
@@ -2,6 +2,4 @@
 
 import dayjs from "dayjs";
 
-export const localetime = function(time) {
-	return dayjs(time).format("D MMMM YYYY, HH:mm:ss");
-};
+export default (time) => dayjs(time).format("D MMMM YYYY, HH:mm:ss");
diff --git a/client/js/helpers/parse.js b/client/js/helpers/parse.js
index 4c7358fb..a61897f1 100644
--- a/client/js/helpers/parse.js
+++ b/client/js/helpers/parse.js
@@ -1,19 +1,20 @@
 "use strict";
 
-const parseStyle = require("./ircmessageparser/parseStyle");
-const findChannels = require("./ircmessageparser/findChannels");
-const findLinks = require("./ircmessageparser/findLinks");
-const findEmoji = require("./ircmessageparser/findEmoji");
-const findNames = require("./ircmessageparser/findNames");
-const merge = require("./ircmessageparser/merge");
-const colorClass = require("./colorClass");
-const emojiMap = require("./fullnamemap.json");
-const LinkPreviewToggle = require("../../components/LinkPreviewToggle.vue").default;
-const LinkPreviewFileSize = require("../../components/LinkPreviewFileSize.vue").default;
-const InlineChannel = require("../../components/InlineChannel.vue").default;
+import parseStyle from "./ircmessageparser/parseStyle";
+import findChannels from "./ircmessageparser/findChannels";
+import findLinks from "./ircmessageparser/findLinks";
+import findEmoji from "./ircmessageparser/findEmoji";
+import findNames from "./ircmessageparser/findNames";
+import merge from "./ircmessageparser/merge";
+import colorClass from "./colorClass";
+import emojiMap from "./fullnamemap.json";
+import LinkPreviewToggle from "../../components/LinkPreviewToggle.vue";
+import LinkPreviewFileSize from "../../components/LinkPreviewFileSize.vue";
+import InlineChannel from "../../components/InlineChannel.vue";
+import store from "../store";
+import {generateUserContextMenu} from "./contextMenu";
+
 const emojiModifiersRegex = /[\u{1f3fb}-\u{1f3ff}]/gu;
-const store = require("../store").default;
-const {generateUserContextMenu} = require("./contextMenu");
 
 // Create an HTML `span` with styling information for a given fragment
 function createFragment(fragment, createElement) {
@@ -71,13 +72,7 @@ function createFragment(fragment, createElement) {
 
 // Transform an IRC message potentially filled with styling control codes, URLs,
 // nicknames, and channels into a string of HTML elements to display on the client.
-module.exports = function parse(
-	createElement,
-	text,
-	message = undefined,
-	network = undefined,
-	$root
-) {
+function parse(createElement, text, message = undefined, network = undefined, $root) {
 	// Extract the styling information and get the plain text version from it
 	const styleFragments = parseStyle(text);
 	const cleanText = styleFragments.map((fragment) => fragment.text).join("");
@@ -220,4 +215,6 @@ module.exports = function parse(
 
 		return fragments;
 	});
-};
+}
+
+export default parse;
diff --git a/client/js/helpers/roundBadgeNumber.js b/client/js/helpers/roundBadgeNumber.js
index 34c18c96..77cdb6e5 100644
--- a/client/js/helpers/roundBadgeNumber.js
+++ b/client/js/helpers/roundBadgeNumber.js
@@ -1,6 +1,6 @@
 "use strict";
 
-module.exports = function(count) {
+export default (count) => {
 	if (count < 1000) {
 		return count.toString();
 	}
diff --git a/client/js/keybinds.js b/client/js/keybinds.js
index 78b8b0b6..7d0a6a49 100644
--- a/client/js/keybinds.js
+++ b/client/js/keybinds.js
@@ -1,9 +1,10 @@
 "use strict";
 
+import Mousetrap from "mousetrap";
+
 const $ = require("jquery");
-const Mousetrap = require("mousetrap");
-const store = require("./store").default;
-const {switchToChannel} = require("./router");
+import store from "./store";
+import {switchToChannel} from "./router";
 
 // Switch to the next/previous window in the channel list.
 Mousetrap.bind(["alt+up", "alt+down"], function(e, keys) {
diff --git a/client/js/localStorage.js b/client/js/localStorage.js
index b2877b72..709ada0e 100644
--- a/client/js/localStorage.js
+++ b/client/js/localStorage.js
@@ -10,7 +10,7 @@
 // https://github.com/thelounge/thelounge/issues/2699
 // https://www.chromium.org/for-testers/bug-reporting-guidelines/uncaught-securityerror-failed-to-read-the-localstorage-property-from-window-access-is-denied-for-this-document
 
-module.exports = {
+export default {
 	set(key, value) {
 		try {
 			window.localStorage.setItem(key, value);
diff --git a/client/js/location.js b/client/js/location.js
index eed5e273..cf490ee5 100644
--- a/client/js/location.js
+++ b/client/js/location.js
@@ -2,7 +2,7 @@
 
 // This is a thin wrapper around `window.location`, in order to contain the
 // side-effects. Do not add logic to it as it cannot be tested, only mocked.
-module.exports = {
+export default {
 	reload() {
 		window.location.reload();
 	},
diff --git a/client/js/router.js b/client/js/router.js
index 616fb998..469d7e4b 100644
--- a/client/js/router.js
+++ b/client/js/router.js
@@ -1,19 +1,19 @@
 "use strict";
 
-const Vue = require("vue").default;
-const VueRouter = require("vue-router").default;
+import Vue from "vue";
+import VueRouter from "vue-router";
+
 Vue.use(VueRouter);
 
-const store = require("./store").default;
-
-const SignIn = require("../components/Windows/SignIn.vue").default;
-const Connect = require("../components/Windows/Connect.vue").default;
-const Settings = require("../components/Windows/Settings.vue").default;
-const Help = require("../components/Windows/Help.vue").default;
-const Changelog = require("../components/Windows/Changelog.vue").default;
-const NetworkEdit = require("../components/Windows/NetworkEdit.vue").default;
-const RoutedChat = require("../components/RoutedChat.vue").default;
-const constants = require("./constants");
+import SignIn from "../components/Windows/SignIn.vue";
+import Connect from "../components/Windows/Connect.vue";
+import Settings from "../components/Windows/Settings.vue";
+import Help from "../components/Windows/Help.vue";
+import Changelog from "../components/Windows/Changelog.vue";
+import NetworkEdit from "../components/Windows/NetworkEdit.vue";
+import RoutedChat from "../components/RoutedChat.vue";
+import constants from "./constants";
+import store from "./store";
 
 const router = new VueRouter({
 	routes: [
@@ -127,9 +127,8 @@ function navigate(routeName, params = {}) {
 	router.push({name: routeName, params}).catch(() => {});
 }
 
-module.exports = {
-	initialize,
-	router,
-	navigate,
-	switchToChannel: (channel) => navigate("RoutedChat", {id: channel.id}),
-};
+function switchToChannel(channel) {
+	return navigate("RoutedChat", {id: channel.id});
+}
+
+export {initialize, router, navigate, switchToChannel};
diff --git a/client/js/settings.js b/client/js/settings.js
index 028c309d..afe9cf0a 100644
--- a/client/js/settings.js
+++ b/client/js/settings.js
@@ -1,4 +1,4 @@
-const socket = require("./socket");
+import socket from "./socket";
 
 const defaultSettingConfig = {
 	apply() {},
diff --git a/client/js/socket-events/auth.js b/client/js/socket-events/auth.js
index a0a415c3..76658a00 100644
--- a/client/js/socket-events/auth.js
+++ b/client/js/socket-events/auth.js
@@ -1,9 +1,10 @@
 "use strict";
 
-const socket = require("../socket");
-const storage = require("../localStorage");
-const {router, navigate} = require("../router");
-const store = require("../store").default;
+import socket from "../socket";
+import storage from "../localStorage";
+import {router, navigate} from "../router";
+import store from "../store";
+import location from "../location";
 let lastServerHash = null;
 
 socket.on("auth:success", function() {
diff --git a/client/js/socket-events/changelog.js b/client/js/socket-events/changelog.js
index 60fc2126..f840e575 100644
--- a/client/js/socket-events/changelog.js
+++ b/client/js/socket-events/changelog.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("changelog", function(data) {
 	store.commit("versionData", data);
diff --git a/client/js/socket-events/commands.js b/client/js/socket-events/commands.js
index f7ca9073..682e53ce 100644
--- a/client/js/socket-events/commands.js
+++ b/client/js/socket-events/commands.js
@@ -1,5 +1,5 @@
-const constants = require("../constants");
-const socket = require("../socket");
+import constants from "../constants";
+import socket from "../socket";
 
 socket.on("commands", function(commands) {
 	if (commands) {
diff --git a/client/js/socket-events/configuration.js b/client/js/socket-events/configuration.js
index a41fca8e..44bdf521 100644
--- a/client/js/socket-events/configuration.js
+++ b/client/js/socket-events/configuration.js
@@ -1,9 +1,9 @@
 "use strict";
 
-const socket = require("../socket");
-const upload = require("../upload");
-const store = require("../store").default;
-const router = require("../router");
+import socket from "../socket";
+import upload from "../upload";
+import store from "../store";
+import {initialize as routerInitialize} from "../router";
 
 socket.once("configuration", function(data) {
 	store.commit("serverConfiguration", data);
@@ -17,7 +17,7 @@ socket.once("configuration", function(data) {
 		upload.initialize();
 	}
 
-	router.initialize();
+	routerInitialize();
 
 	// If localStorage contains a theme that does not exist on this server, switch
 	// back to its default theme.
diff --git a/client/js/socket-events/connection.js b/client/js/socket-events/connection.js
index 50cdcc8b..3e2572e6 100644
--- a/client/js/socket-events/connection.js
+++ b/client/js/socket-events/connection.js
@@ -1,5 +1,5 @@
-const store = require("../store").default;
-const socket = require("../socket");
+import store from "../store";
+import socket from "../socket";
 
 socket.on("disconnect", handleDisconnect);
 socket.on("connect_error", handleDisconnect);
diff --git a/client/js/socket-events/index.js b/client/js/socket-events/index.js
index 902aaf1f..722ec3a7 100644
--- a/client/js/socket-events/index.js
+++ b/client/js/socket-events/index.js
@@ -1,25 +1,25 @@
 "use strict";
 
-require("./connection");
-require("./auth");
-require("./commands");
-require("./init");
-require("./join");
-require("./more");
-require("./msg");
-require("./msg_preview");
-require("./msg_special");
-require("./names");
-require("./network");
-require("./nick");
-require("./open");
-require("./part");
-require("./quit");
-require("./sync_sort");
-require("./topic");
-require("./users");
-require("./sign_out");
-require("./sessions_list");
-require("./configuration");
-require("./changelog");
-require("./setting");
+import "./connection";
+import "./auth";
+import "./commands";
+import "./init";
+import "./join";
+import "./more";
+import "./msg";
+import "./msg_preview";
+import "./msg_special";
+import "./names";
+import "./network";
+import "./nick";
+import "./open";
+import "./part";
+import "./quit";
+import "./sync_sort";
+import "./topic";
+import "./users";
+import "./sign_out";
+import "./sessions_list";
+import "./configuration";
+import "./changelog";
+import "./setting";
diff --git a/client/js/socket-events/init.js b/client/js/socket-events/init.js
index 8206832b..4cec3e80 100644
--- a/client/js/socket-events/init.js
+++ b/client/js/socket-events/init.js
@@ -1,9 +1,9 @@
 "use strict";
 
-const socket = require("../socket");
-const storage = require("../localStorage");
-const {router, switchToChannel, navigate} = require("../router");
-const store = require("../store").default;
+import socket from "../socket";
+import storage from "../localStorage";
+import {router, switchToChannel, navigate} from "../router";
+import store from "../store";
 
 socket.on("init", function(data) {
 	store.commit("networks", mergeNetworkData(data.networks));
diff --git a/client/js/socket-events/join.js b/client/js/socket-events/join.js
index a9ce2397..d0da287b 100644
--- a/client/js/socket-events/join.js
+++ b/client/js/socket-events/join.js
@@ -1,8 +1,8 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
-const {switchToChannel} = require("../router");
+import socket from "../socket";
+import store from "../store";
+import {switchToChannel} from "../router";
 
 socket.on("join", function(data) {
 	store.getters.initChannel(data.chan);
diff --git a/client/js/socket-events/more.js b/client/js/socket-events/more.js
index dd822824..51b4d395 100644
--- a/client/js/socket-events/more.js
+++ b/client/js/socket-events/more.js
@@ -2,8 +2,8 @@
 
 import Vue from "vue";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("more", function(data) {
 	const channel = store.getters.findChannel(data.chan);
diff --git a/client/js/socket-events/msg.js b/client/js/socket-events/msg.js
index 82c9e186..283deba0 100644
--- a/client/js/socket-events/msg.js
+++ b/client/js/socket-events/msg.js
@@ -1,10 +1,9 @@
 "use strict";
 
-const socket = require("../socket");
-const cleanIrcMessage = require("../helpers/ircmessageparser/cleanIrcMessage");
-const webpush = require("../webpush");
-const store = require("../store").default;
-const {switchToChannel} = require("../router");
+import socket from "../socket";
+import cleanIrcMessage from "../helpers/ircmessageparser/cleanIrcMessage";
+import store from "../store";
+import {switchToChannel} from "../router";
 
 let pop;
 
@@ -129,7 +128,7 @@ function notifyMessage(targetId, channel, activeChannel, msg) {
 				const timestamp = Date.parse(msg.time);
 
 				try {
-					if (webpush.hasServiceWorker) {
+					if (store.state.hasServiceWorker) {
 						navigator.serviceWorker.ready.then((registration) => {
 							registration.active.postMessage({
 								type: "notification",
diff --git a/client/js/socket-events/msg_preview.js b/client/js/socket-events/msg_preview.js
index ba43f11e..19085762 100644
--- a/client/js/socket-events/msg_preview.js
+++ b/client/js/socket-events/msg_preview.js
@@ -2,8 +2,8 @@
 
 import Vue from "vue";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("msg:preview", function(data) {
 	const {channel} = store.getters.findChannel(data.chan);
diff --git a/client/js/socket-events/msg_special.js b/client/js/socket-events/msg_special.js
index 3491988e..52c6ebef 100644
--- a/client/js/socket-events/msg_special.js
+++ b/client/js/socket-events/msg_special.js
@@ -1,8 +1,8 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
-const {switchToChannel} = require("../router");
+import socket from "../socket";
+import store from "../store";
+import {switchToChannel} from "../router";
 
 socket.on("msg:special", function(data) {
 	const channel = store.getters.findChannel(data.chan);
diff --git a/client/js/socket-events/names.js b/client/js/socket-events/names.js
index 624a26df..ac0d1fa0 100644
--- a/client/js/socket-events/names.js
+++ b/client/js/socket-events/names.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("names", function(data) {
 	const channel = store.getters.findChannel(data.id);
diff --git a/client/js/socket-events/network.js b/client/js/socket-events/network.js
index f25790b5..0c071952 100644
--- a/client/js/socket-events/network.js
+++ b/client/js/socket-events/network.js
@@ -2,9 +2,9 @@
 
 import Vue from "vue";
 
-const socket = require("../socket");
-const store = require("../store").default;
-const {switchToChannel} = require("../router");
+import socket from "../socket";
+import store from "../store";
+import {switchToChannel} from "../router";
 
 socket.on("network", function(data) {
 	const network = data.networks[0];
diff --git a/client/js/socket-events/nick.js b/client/js/socket-events/nick.js
index 9189448c..6713b9b8 100644
--- a/client/js/socket-events/nick.js
+++ b/client/js/socket-events/nick.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("nick", function(data) {
 	const network = store.getters.findNetwork(data.network);
diff --git a/client/js/socket-events/open.js b/client/js/socket-events/open.js
index db491254..4bd01058 100644
--- a/client/js/socket-events/open.js
+++ b/client/js/socket-events/open.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 // Sync unread badge and marker when other clients open a channel
 socket.on("open", function(id) {
diff --git a/client/js/socket-events/part.js b/client/js/socket-events/part.js
index fca18277..c9724a45 100644
--- a/client/js/socket-events/part.js
+++ b/client/js/socket-events/part.js
@@ -1,8 +1,8 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
-const {switchToChannel} = require("../router");
+import socket from "../socket";
+import store from "../store";
+import {switchToChannel} from "../router";
 
 socket.on("part", function(data) {
 	// When parting from the active channel/query, jump to the network's lobby
diff --git a/client/js/socket-events/quit.js b/client/js/socket-events/quit.js
index 74cbd075..31d296b3 100644
--- a/client/js/socket-events/quit.js
+++ b/client/js/socket-events/quit.js
@@ -1,8 +1,8 @@
 "use strict";
 
-const socket = require("../socket");
-const {switchToChannel, navigate} = require("../router");
-const store = require("../store").default;
+import socket from "../socket";
+import {switchToChannel, navigate} from "../router";
+import store from "../store";
 
 socket.on("quit", function(data) {
 	// If we're in a channel, and it's on the network that is being removed,
diff --git a/client/js/socket-events/sessions_list.js b/client/js/socket-events/sessions_list.js
index 810978da..818cfe2b 100644
--- a/client/js/socket-events/sessions_list.js
+++ b/client/js/socket-events/sessions_list.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("sessions:list", function(data) {
 	data.sort((a, b) => b.lastUse - a.lastUse);
diff --git a/client/js/socket-events/setting.js b/client/js/socket-events/setting.js
index cb5b3f16..3202ae45 100644
--- a/client/js/socket-events/setting.js
+++ b/client/js/socket-events/setting.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("setting:new", function(data) {
 	const name = data.name;
diff --git a/client/js/socket-events/sign_out.js b/client/js/socket-events/sign_out.js
index 9cb5ebfb..d5f0e43f 100644
--- a/client/js/socket-events/sign_out.js
+++ b/client/js/socket-events/sign_out.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const Auth = require("../auth");
+import socket from "../socket";
+import Auth from "../auth";
 
 socket.on("sign-out", function() {
 	Auth.signout();
diff --git a/client/js/socket-events/sync_sort.js b/client/js/socket-events/sync_sort.js
index d3c2df0b..b2661ee8 100644
--- a/client/js/socket-events/sync_sort.js
+++ b/client/js/socket-events/sync_sort.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("sync_sort", function(data) {
 	const order = data.order;
diff --git a/client/js/socket-events/topic.js b/client/js/socket-events/topic.js
index 48148765..a9ab5c8a 100644
--- a/client/js/socket-events/topic.js
+++ b/client/js/socket-events/topic.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("topic", function(data) {
 	const channel = store.getters.findChannel(data.chan);
diff --git a/client/js/socket-events/users.js b/client/js/socket-events/users.js
index ae74ae8b..95fa49a4 100644
--- a/client/js/socket-events/users.js
+++ b/client/js/socket-events/users.js
@@ -1,7 +1,7 @@
 "use strict";
 
-const socket = require("../socket");
-const store = require("../store").default;
+import socket from "../socket";
+import store from "../store";
 
 socket.on("users", function(data) {
 	if (store.state.activeChannel && store.state.activeChannel.channel.id === data.chan) {
diff --git a/client/js/socket.js b/client/js/socket.js
index 02d831ba..9afa01cf 100644
--- a/client/js/socket.js
+++ b/client/js/socket.js
@@ -1,6 +1,6 @@
 "use strict";
 
-const io = require("socket.io-client");
+import io from "socket.io-client";
 
 const socket = io({
 	transports: JSON.parse(document.body.dataset.transports),
@@ -9,4 +9,4 @@ const socket = io({
 	reconnection: !document.body.classList.contains("public"),
 });
 
-module.exports = socket;
+export default socket;
diff --git a/client/js/store-settings.js b/client/js/store-settings.js
index b0bb0120..9792a51b 100644
--- a/client/js/store-settings.js
+++ b/client/js/store-settings.js
@@ -1,5 +1,5 @@
-const storage = require("./localStorage");
-const socket = require("./socket");
+import storage from "./localStorage";
+import socket from "./socket";
 import {config, createState} from "./settings";
 
 export function createSettingsStore(store) {
diff --git a/client/js/store.js b/client/js/store.js
index 83ff04fa..8c5bba37 100644
--- a/client/js/store.js
+++ b/client/js/store.js
@@ -1,8 +1,8 @@
 import Vue from "vue";
 import Vuex from "vuex";
 import {createSettingsStore} from "./store-settings";
+import storage from "./localStorage";
 
-const storage = require("./localStorage");
 const appName = document.title;
 
 Vue.use(Vuex);
@@ -26,6 +26,7 @@ const store = new Vuex.Store({
 		isAutoCompleting: false,
 		isConnected: false,
 		networks: [],
+		hasServiceWorker: false,
 		pushNotificationState: "unsupported",
 		serverConfiguration: null,
 		sessions: [],
@@ -67,6 +68,9 @@ const store = new Vuex.Store({
 		sortNetworks(state, sortFn) {
 			state.networks.sort(sortFn);
 		},
+		hasServiceWorker(state) {
+			state.hasServiceWorker = true;
+		},
 		pushNotificationState(state, pushNotificationState) {
 			state.pushNotificationState = pushNotificationState;
 		},
diff --git a/client/js/upload.js b/client/js/upload.js
index cdfcbc29..85f7da3c 100644
--- a/client/js/upload.js
+++ b/client/js/upload.js
@@ -1,8 +1,9 @@
 "use strict";
 
-const socket = require("./socket");
-const updateCursor = require("undate").update;
-const store = require("./store").default;
+import {update as updateCursor} from "undate";
+
+import socket from "./socket";
+import store from "./store";
 
 class Uploader {
 	init() {
@@ -219,7 +220,7 @@ class Uploader {
 
 const instance = new Uploader();
 
-module.exports = {
+export default {
 	abort: () => instance.abort(),
 	initialize: () => instance.init(),
 	mounted: () => instance.mounted(),
diff --git a/client/js/vue.js b/client/js/vue.js
index 6157a9c7..fbd69065 100644
--- a/client/js/vue.js
+++ b/client/js/vue.js
@@ -1,20 +1,19 @@
 "use strict";
 
-const Vue = require("vue").default;
-
-const store = require("./store").default;
-const App = require("../components/App.vue").default;
-const {localetime} = require("./helpers/localetime");
-const storage = require("./localStorage");
-const {router, navigate} = require("./router");
-const constants = require("./constants");
-const socket = require("./socket");
+import Vue from "vue";
+import store from "./store";
+import App from "../components/App.vue";
+import localetime from "./helpers/localetime";
+import storage from "./localStorage";
+import {router, navigate} from "./router";
+import constants from "./constants";
+import socket from "./socket";
 
 Vue.filter("localetime", localetime);
 
-require("./socket-events");
-require("./webpush");
-require("./keybinds");
+import "./socket-events";
+import "./webpush";
+import "./keybinds";
 
 const favicon = document.getElementById("favicon");
 const faviconNormal = favicon.getAttribute("href");
diff --git a/client/js/webpush.js b/client/js/webpush.js
index b93b0dad..f499eb47 100644
--- a/client/js/webpush.js
+++ b/client/js/webpush.js
@@ -1,8 +1,10 @@
 "use strict";
 
-const socket = require("./socket");
-const store = require("./store").default;
-const {switchToChannel} = require("./router");
+import socket from "./socket";
+import store from "./store";
+import {switchToChannel} from "./router";
+
+export default {togglePushSubscription};
 
 if ("serviceWorker" in navigator) {
 	navigator.serviceWorker.addEventListener("message", (event) => {
@@ -17,8 +19,6 @@ if ("serviceWorker" in navigator) {
 	});
 }
 
-module.exports.hasServiceWorker = false;
-
 socket.once("push:issubscribed", function(hasSubscriptionOnServer) {
 	if (!isAllowedServiceWorkersHost()) {
 		store.commit("pushNotificationState", "nohttps");
@@ -32,7 +32,7 @@ socket.once("push:issubscribed", function(hasSubscriptionOnServer) {
 	navigator.serviceWorker
 		.register("service-worker.js")
 		.then((registration) => {
-			module.exports.hasServiceWorker = true;
+			store.commit("hasServiceWorker");
 
 			if (!registration.pushManager) {
 				return;
@@ -62,7 +62,7 @@ socket.once("push:issubscribed", function(hasSubscriptionOnServer) {
 		});
 });
 
-module.exports.togglePushSubscription = () => {
+function togglePushSubscription() {
 	store.commit("pushNotificationState", "loading");
 
 	navigator.serviceWorker.ready
@@ -94,7 +94,7 @@ module.exports.togglePushSubscription = () => {
 			store.commit("pushNotificationState", "unsupported");
 			console.error(err); // eslint-disable-line no-console
 		});
-};
+}
 
 function isAllowedServiceWorkersHost() {
 	return (