refactor: turn on verbatimModuleSyntax

Signed-off-by: Varun Patil <radialapps@gmail.com>

e2e/login.ts

@@ -1,4 +1,4 @@
-import { expect, PlaywrightTestArgs } from '@playwright/test';
+import { expect, type PlaywrightTestArgs } from '@playwright/test';
 
 export function login(route: string) {
   return async ({ page }: PlaywrightTestArgs) => {

src/components/ClusterHList.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import Cluster from './frame/Cluster.vue';
 

src/components/ScrollerManager.vue

@@ -50,7 +50,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import * as utils from '@services/utils';
 

src/components/SelectionManager.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import { showError } from '@nextcloud/dialogs';
 

src/components/admin/AdminMixin.ts

@@ -1,4 +1,4 @@
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 import axios from '@nextcloud/axios';
 
 const NcCheckboxRadioSwitch = () => import('@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch');

src/components/frame/Cluster.vue

@@ -33,7 +33,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble';
 

src/components/frame/Folder.vue

@@ -24,7 +24,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import UserConfig from '@mixins/UserConfig';
 

src/components/frame/Photo.vue

@@ -71,7 +71,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import * as utils from '@services/utils';
 

src/components/frame/RowHead.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import * as utils from '@services/utils';
 

src/components/modal/AlbumCollaborators.vue

@@ -127,7 +127,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import Magnify from 'vue-material-design-icons/Magnify.vue';
 import Close from 'vue-material-design-icons/Close.vue';

src/components/modal/AlbumForm.vue

@@ -88,7 +88,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import { showError } from '@nextcloud/dialogs';
 import NcButton from '@nextcloud/vue/dist/Components/NcButton';

src/components/modal/AlbumPicker.vue

@@ -73,7 +73,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import Fuse from 'fuse.js';
 

src/components/modal/AlbumsList.vue

@@ -31,7 +31,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import NcButton from '@nextcloud/vue/dist/Components/NcButton';
 const NcListItem = () => import('@nextcloud/vue/dist/Components/NcListItem');

src/components/top-matter/DynamicTopMatter.vue

@@ -6,8 +6,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
-import { Component } from 'vue';
+import { defineComponent, type Component } from 'vue';
 
 import UserMixin from '@mixins/UserConfig';
 

src/components/viewer/ImageEditor.vue

@@ -8,13 +8,13 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, type PropType } from 'vue';
 
 import axios from '@nextcloud/axios';
 import { showError, showSuccess } from '@nextcloud/dialogs';
 import { getLanguage } from '@nextcloud/l10n';
 
-import { FilerobotImageEditorConfig } from 'react-filerobot-image-editor';
+import type { FilerobotImageEditorConfig } from 'react-filerobot-image-editor';
 
 import translations from './ImageEditorTranslations';
 

src/components/viewer/PsImage.ts

@@ -3,7 +3,7 @@ import PhotoSwipe from 'photoswipe';
 import { isVideoContent } from './PsVideo';
 import { isLiveContent } from './PsLivePhoto';
 import { fetchImage } from '../frame/XImgCache';
-import { PsContent, PsEvent, PsSlide } from './types';
+import type { PsContent, PsEvent, PsSlide } from './types';
 
 import errorsvg from '@assets/error.svg';
 

src/components/viewer/PsVideo.ts

@@ -10,8 +10,8 @@ import { API } from '@services/API';
 
 import type { PsContent, PsEvent } from './types';
 
-import Player from 'video.js/dist/types/player';
-import { QualityLevelList } from 'videojs-contrib-quality-levels';
+import type Player from 'video.js/dist/types/player';
+import type { QualityLevelList } from 'videojs-contrib-quality-levels';
 
 type VideoContent = PsContent & {
   videoElement: HTMLVideoElement | null;

src/components/viewer/Viewer.vue

@@ -185,7 +185,7 @@ import * as utils from '@services/utils';
 import * as nativex from '@native';
 
 import ImageEditor from './ImageEditor.vue';
-import PhotoSwipe, { PhotoSwipeOptions } from 'photoswipe';
+import PhotoSwipe, { type PhotoSwipeOptions } from 'photoswipe';
 import 'photoswipe/style.css';
 import PsImage from './PsImage';
 import PsVideo from './PsVideo';

src/components/viewer/types.ts

@@ -1,5 +1,5 @@
 import Content from 'photoswipe/dist/types/slide/content';
-import Slide, { _SlideData } from 'photoswipe/dist/types/slide/slide';
+import Slide, { type _SlideData } from 'photoswipe/dist/types/slide/slide';
 import type { IPhoto, IConfig } from '@typings';
 
 type PsAugment = {

src/router.ts

@@ -1,4 +1,4 @@
-import Router, { Route, RouteConfig } from 'vue-router';
+import Router, { type Route, type RouteConfig } from 'vue-router';
 import Vue from 'vue';
 
 import { generateUrl } from '@nextcloud/router';

tsconfig.json

@@ -17,6 +17,7 @@
     "strictNullChecks": true,
     "alwaysStrict": true,
     "incremental": true,
+    "verbatimModuleSyntax": true,
     "paths": {
       "@services/*": [
         "./src/services/*"

webpack.config.ts

@@ -1,10 +1,10 @@
-import webpack from 'webpack';
-import path from 'path';
+const webpack = require('webpack');
+const path = require('path');
 
-import WorkboxPlugin from 'workbox-webpack-plugin';
-import TerserPlugin from 'terser-webpack-plugin';
-import NodePolyfillPlugin from 'node-polyfill-webpack-plugin';
-import { VueLoaderPlugin } from 'vue-loader';
+const WorkboxPlugin = require('workbox-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');
+const { VueLoaderPlugin } = require('vue-loader');
 
 const appName = process.env.npm_package_name!;
 const appVersion = process.env.npm_package_version!;