.eslintignore

+**/*.min.js
\ No newline at end of file

.eslintrc.js

+module.exports = {
+  root: true,
+  env: {
+    node: true,
+  },
+  extends: [
+    "plugin:vue/essential",
+    "eslint:recommended",
+    "@vue/typescript/recommended",
+    "@vue/prettier",
+    "@vue/prettier/@typescript-eslint",
+  ],
+  parserOptions: {
+    ecmaVersion: 2020,
+  },
+  rules: {
+    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
+  },
+};

README.md

@@ -18,7 +18,7 @@ This template includes:
 
 ## Project setup
 ```
-npm install
+npm install 
 ```
 
 ### Compiles and hot-reloads for development

package.json

 {
   "name": "@coscine/projectedit",
-  "version": "1.2.4",
+  "version": "1.3.0",
   "private": true,
   "directories": {
     "doc": "docs"
@@ -13,7 +13,7 @@
   "dependencies": {
     "@coscine/app-util": "^1.9.0",
     "@coscine/component-library": "^1.9.0",
-    "@coscine/project-creation": "^1.14.0",
+    "@coscine/project-creation": "^1.15.1",
     "@itcenter-layout/bootstrap": "^1.5.5",
     "@itcenter-layout/masterpage": "^1.3.0",
     "@types/jquery": "^3.5.2",
@@ -31,20 +31,38 @@
     "@semantic-release/npm": "^7.0.6",
     "@semantic-release/release-notes-generator": "^9.0.1",
     "@types/node": "^14.14.20",
-    "@typescript-eslint/eslint-plugin": "^4.12.0",
-    "@typescript-eslint/parser": "^4.12.0",
+    "@typescript-eslint/eslint-plugin": "^4.18.0",
+    "@typescript-eslint/parser": "^4.18.0",
+    "@vue/cli-plugin-eslint": "~4.5.0",
     "@vue/cli-plugin-typescript": "^4.5.7",
     "@vue/cli-service": "^4.5.7",
+    "@vue/eslint-config-prettier": "^6.0.0",
+    "@vue/eslint-config-typescript": "^7.0.0",
     "conventional-changelog-eslint": "3.0.9",
     "core-js": "^3.8.2",
-    "eslint": "^7.17.0",
+    "eslint": "^6.7.2",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-vue": "^6.2.2",
+    "lint-staged": "^9.5.0",
+    "prettier": "^2.2.1",
     "semantic-release": "^17.3.1",
+    "tslib": "^2.3.0",
     "typescript": "~4.3.3",
     "vue-template-compiler": "^2.6.12"
   },
+  "gitHooks": {
+    "pre-commit": "lint-staged"
+  },
+  "lint-staged": {
+    "*.{js,jsx,vue,ts,tsx}": [
+      "vue-cli-service lint",
+      "git add"
+    ]
+  },
   "repository": {
     "type": "git",
     "url": "https://git.rwth-aachen.de/coscine/frontend/apps/projectedit.git"
   },
-  "license": "MIT"
+  "license": "MIT",
+  "packageManager": "yarn@3.1.0"
 }

src/ProjectEditApp.vue

 <template>
   <div id="projectedit" class="container">
-    <h4 style="text-align: left;">{{ $t('headline') }}:</h4>
-    <component 
-      :is="currentComponent" 
+    <h4 style="text-align: left">{{ $t("headline") }}:</h4>
+    <component
+      :is="currentComponent"
       :projectId="selectedProjectId"
       :languageLocale="language"
     />
@@ -10,18 +10,18 @@
 </template>
 
 <script lang="ts">
-import Vue from 'vue';
-import CreateProject from '@coscine/project-creation';
-import '@coscine/project-creation/dist/index.css';
-import { LanguageUtil, GuidUtil } from '@coscine/app-util';
+import Vue from "vue";
+import CreateProject from "@coscine/project-creation";
+import "@coscine/project-creation/dist/index.css";
+import { LanguageUtil, GuidUtil } from "@coscine/app-util";
 
 Vue.use(CreateProject);
 
 export default Vue.extend({
-  name: 'projectedit',
+  name: "projectedit",
   data() {
     return {
-      currentComponent: 'CreateProject',
+      currentComponent: "CreateProject",
       selectedProjectId: GuidUtil.getProjectId(),
       language: LanguageUtil.getLanguage(),
     };

src/coscine.d.ts

-declare var coscine: {
-    authorization: {
-        bearer: string,
-    },
-    i18n: {
-        projectedit: {},
-    },
+declare let coscine: {
+  authorization: {
+    bearer: string;
+  };
+  i18n: {
+    projectedit: VueI18n.LocaleMessages | undefined;
+  };
 };
-declare var _spPageContextInfo: any;
-declare module '@itcenter-layout/bootstrap'
\ No newline at end of file
+declare const _spPageContextInfo: unknown;
+declare module "@itcenter-layout/bootstrap";

src/main.ts

-import jQuery from 'jquery';
-import BootstrapVue from 'bootstrap-vue';
-import '@itcenter-layout/bootstrap/dist/css/rwth-theme.css';
-import '@itcenter-layout/bootstrap/dist/css/material-icons.css';
-import '@itcenter-layout/masterpage/dist/css/itcenter-masterdesign-masterpage.css';
-import Vue from 'vue';
-import ProjectEditApp from './ProjectEditApp.vue';
-import VueI18n from 'vue-i18n';
-import { LanguageUtil } from '@coscine/app-util';
+import jQuery from "jquery";
+import BootstrapVue from "bootstrap-vue";
+import "@itcenter-layout/bootstrap/dist/css/rwth-theme.css";
+import "@itcenter-layout/bootstrap/dist/css/material-icons.css";
+import "@itcenter-layout/masterpage/dist/css/itcenter-masterdesign-masterpage.css";
+import Vue from "vue";
+import ProjectEditApp from "./ProjectEditApp.vue";
+import VueI18n from "vue-i18n";
+import { LanguageUtil } from "@coscine/app-util";
 
 Vue.config.productionTip = false;
 Vue.use(BootstrapVue);
 Vue.use(VueI18n);
 
 jQuery(() => {
-    const i18n = new VueI18n({
-      locale: LanguageUtil.getLanguage(),
-      messages: coscine.i18n.projectedit,
-      silentFallbackWarn: true,
-    });
+  const i18n = new VueI18n({
+    locale: LanguageUtil.getLanguage(),
+    messages: coscine.i18n.projectedit,
+    silentFallbackWarn: true,
+  });
 
-    new Vue({
-      render: (h) => h(ProjectEditApp),
-      i18n,
-    }).$mount('projectedit');
+  new Vue({
+    render: (h) => h(ProjectEditApp),
+    i18n,
+  }).$mount("projectedit");
 });

src/shims-tsx.d.ts

-import Vue, { VNode } from 'vue';
+import Vue, { VNode } from "vue";
 
 declare global {
   namespace JSX {

src/shims-vue.d.ts

-declare module '*.vue' {
-  import Vue from 'vue';
+declare module "*.vue" {
+  import Vue from "vue";
   export default Vue;
 }
 
-declare module '@coscine/project-creation';
-declare module '@coscine/app-util';
-declare module '@coscine/component-library';
+declare module "@coscine/project-creation";
+declare module "@coscine/app-util";
+declare module "@coscine/component-library";
 
 declare module "*.png" {
-  const value: any;
+  const value: string;
   export default value;
-}
\ No newline at end of file
+}

tsconfig.json

 {
   "compilerOptions": {
-    "target": "esnext",
-    "module": "esnext",
+    "target": "es6",
+    "module": "es6",
     "strict": true,
     "jsx": "preserve",
     "importHelpers": true,
@@ -24,7 +24,7 @@
       ]
     },
     "lib": [
-      "esnext",
+      "es6",
       "dom",
       "dom.iterable",
       "scripthost"

vue.config.js

 module.exports = {
+  devServer: {
+    disableHostCheck: true,
+  },
+  publicPath: "./",
+  configureWebpack: {
+    devtool: "source-map",
     devServer: {
-        disableHostCheck: true,
+      port: 9272,
     },
-    publicPath: './',
-    configureWebpack: {
-        devtool: 'source-map',
-        devServer: {
-            port: 9272,
-        }
-    },
-    filenameHashing: false,
-    chainWebpack: config => {
-        config.optimization.delete('splitChunks')
-    },
-    css: {
-        extract: false,
-    },
-}
\ No newline at end of file
+  },
+  filenameHashing: false,
+  chainWebpack: (config) => {
+    config.optimization.delete("splitChunks");
+  },
+  css: {
+    extract: false,
+  },
+};