Merge branch 'Product/1107-frontendPerformance' into 'master'

Product/1107 frontend performance

See merge request !21

.gitignore

@@ -2,6 +2,14 @@
 node_modules
 /dist
 
+# yarn
+.yarn/*
+!.yarn/releases
+!.yarn/plugins
+!.yarn/sdks
+!.yarn/versions
+.pnp.*
+
 # local env files
 .env.local
 .env.*.local
@@ -19,5 +27,3 @@ yarn-error.log*
 *.njsproj
 *.sln
 *.sw*
-
-.rpt2_cache
\ No newline at end of file

.gitlab-ci.yml

+include:
+  - project: coscine/tools/gitlab-ci-templates
+    file: 
+      - /docker-runner.yml
+      - /nodejs.yml
+
 stages:
-  - test
+  - build
+# there are more stages in the imported file but we only want to import some
+#  - test
   - publish
-  - release
-  - pre_release
 
-before_script:
-    - npm install
+build-branch:
+  extends: .build-branch
+
+build-npm-release:
+  extends: .build-npm-release
 
-test:
-  stage: test
-  script:
-    - npm run build
-    - npm test
-  except:
-    refs:
-      - master
-      - tags
-    variables:
-      - $GITLAB_USER_ID == $GIT_BOT_USER_ID
+publish-branch-prerelease:
+  extends: .publish-branch-prerelease
 
-publish:
-  stage: publish
-  script:
-    - npm run build
-    - npm test
-    - npx semantic-release
-  only:
-    - master
-  except:
-    variables:
-      - $GITLAB_USER_ID == $GIT_BOT_USER_ID
+publish-master-release:
+  extends: .publish-master-release
 
-release:
-  stage: release
-  script:
-    - npm run build
-  artifacts:
-    paths:
-      - dist
-  only:
-    - tags
+publish-gitlab:
+  extends: .publish-gitlab-release
 
-pre_release:
-  stage: pre_release
-  script:
-    - npm run build
-  artifacts:
-    paths:
-      - dist
-  when: manual
-  except:
-    - tags
-    - master
+publish-npm:
+  extends: .publish-npm-release

.releaserc

@@ -10,10 +10,11 @@
       "preset": "eslint",
       "gitlabUrl": "https://git.rwth-aachen.de"
     }],
+    #Currently not supported
     ["@semantic-release/npm", {
       "preset": "eslint",
       "tarballDir": "dist",
-      "npmPublish": true
+      "npmPublish": false
     }],
     ["@semantic-release/git", {
       "preset": "eslint",

.yarnrc.yml

+packageExtensions:
+  "@vue/cli-service@*":
+    peerDependencies:
+      "@vue/cli-plugin-babel": "*"
+      "@vue/cli-plugin-eslint": "*"
+      "@vue/cli-plugin-typescript": "*"
+  "@vue/cli-plugin-typescript@*":
+    peerDependencies:
+      "babel-loader": "*"
+  "fork-ts-checker-webpack-plugin@*":
+    dependencies:
+      "vue-template-compiler": "*"
+    peerDependencies:
+      "typescript": "*"
+  "vue-i18n@*":
+    dependencies:
+      "vue": "^2.6.12"
+  "vue-material-design-icons@*":
+    dependencies:
+      "vue": "^2.6.12"      
+  "vue-router@*":
+    dependencies:
+      "vue": "^2.6.12"
+  "vuex@*":
+    dependencies:
+      "vue": "^2.6.12"
+  "bootstrap-vue@*":
+    dependencies:
+      "vue": "^2.6.12"
+      "jquery": "*"

bili.config.ts

-import { Config } from 'bili';
-
-const config: Config = {
-    banner: true,
-    plugins: {
-        vue: {
-            css: true,
-        },
-        typescript2: {
-            // Override the config in `tsconfig.json`
-            tsconfigOverride: {
-                include: ['src'],
-            },
-        },
-    },
-
-     // Let's take this opportunity to move the CLI flags here as well
-    input: 'src/index.ts',
-    output: {
-        format: ['cjs', 'esm'],
-        extractCSS: true,
-    },
-};
-
-export default config;

package.json

 {
   "name": "@coscine/component-library",
-  "version": "1.4.1",
-  "main": "./dist/index.js",
-  "module": "dist/index.esm.js",
-  "types": "dist/index.d.ts",
+  "version": "1.4.2",
+  "main": "dist/index.umd.js",
+  "module": "dist/index.common.js",
+  "browser": "dist/index.umd.min.js",
+  "style": "dist/index.css",
   "directories": {
     "doc": "docs"
   },
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/",
-    "tag": "latest"
-  },
   "scripts": {
-    "dev": "vue serve CreateProject.vue",
-    "build": "bili",
+    "build": "vue-cli-service build --target lib --name index ./src/index.ts",
     "lint": "vue-cli-service lint",
     "test:unit": "vue-cli-service test:unit"
   },
@@ -22,13 +17,14 @@
     "dist/*"
   ],
   "dependencies": {
-    "@types/jquery": "^3.5.3",
-    "bootstrap-vue": "^2.17.3",
+    "@types/jquery": "^3.5.5",
+    "bootstrap-vue": "^2.20.1",
+    "core-js": "^3.8.1",
     "jquery": "^3.5.1",
     "vue": "^2.6.12",
-    "vue-i18n": "^8.22.0",
+    "vue-i18n": "^8.22.2",
     "vue-loading-overlay": "^3.4.2",
-    "vue-material-design-icons": "^4.9.0",
+    "vue-material-design-icons": "^4.11.0",
     "vue-runtime-helpers": "^1.1.2"
   },
   "devDependencies": {
@@ -38,18 +34,10 @@
     "@semantic-release/gitlab": "^6.0.5",
     "@semantic-release/npm": "^7.0.6",
     "@semantic-release/release-notes-generator": "^9.0.1",
-    "@types/chai": "^4.2.13",
-    "@types/mocha": "^8.0.3",
-    "@vue/cli-plugin-babel": "^4.5.7",
+    "@types/node": "^14.14.20",
     "@vue/cli-plugin-typescript": "^4.5.7",
-    "@vue/cli-plugin-unit-mocha": "^4.5.7",
     "@vue/cli-service": "^4.5.7",
-    "@vue/test-utils": "1.1.0",
-    "bili": "^5.0.5",
-    "chai": "^4.2.0",
-    "rollup": "^2.30.0",
-    "rollup-plugin-typescript2": "^0.27.3",
-    "rollup-plugin-vue": "^5.1.9",
+    "core-js": "^3.8.2",
     "semantic-release": "^17.3.1",
     "typescript": "^4.0.3",
     "vue-template-compiler": "^2.6.12"

postcss.config.js

-module.exports = {
-  plugins: {
-    autoprefixer: {}
-  }
-}

src/components/Container/Card.vue

@@ -61,7 +61,7 @@ export default {
 };
 </script>
 <style>
-.coscine_card h6 {
+.card.coscine_card h6 {
   margin: 0.3em;
   color: #00549f;
   text-overflow: ellipsis;
@@ -71,17 +71,17 @@ export default {
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
 }
-div.card-body {
+.card.coscine_card div.card-body {
   padding: 0 0 0 0;
 }
-div.card-body {
+.card.coscine_card div.card-body {
   margin-right: -15px;
   margin-left: -15px;
 }
-div.container-fluid {
+.card.coscine_card div.container-fluid {
   padding: 0;
 }
-.coscine_card .card_icon {
+.card.coscine_card .card_icon {
   width: 3em;
 }
 .card.coscine_card {
@@ -95,17 +95,17 @@ div.container-fluid {
   margin: 0.5em;
   text-align: center;
 }
-.coscine_card .icon_bar {
+.card.coscine_card .icon_bar {
   height: 2em;
   visibility: hidden;
 }
-.coscine_card:hover .icon_bar {
+.card.coscine_cardd:hover .icon_bar {
   visibility: visible;
 }
-.coscine_card:hover {
+.card.coscine_card:hover {
   background-color: #cccccc;
 }
-.coscine_card .icon_bar .edit_button {
+.card.coscine_card .icon_bar .edit_button {
   padding: 0.1em;
   width: auto;
   height: auto;
@@ -117,7 +117,7 @@ div.container-fluid {
   border-color: #00549f;
   border-image: none;
 }
-.coscine_card .icon_bar .edit_button:hover {
+.card.coscine_card .icon_bar .edit_button:hover {
   color: white;
   background-color: #00549f;
 }

tsconfig.json

@@ -10,10 +10,13 @@
     "allowSyntheticDefaultImports": true,
     "sourceMap": true,
     "baseUrl": ".",
+    "skipLibCheck": true,
+    "outDir": "dist",
+    "declaration": true,
+    "declarationDir": "dist",
     "types": [
       "webpack-env",
-      "mocha",
-      "chai"
+      "node"
     ],
     "paths": {
       "@/*": [

tslint.json

-{
-  "defaultSeverity": "warning",
-  "extends": [
-    "tslint:recommended"
-  ],
-  "linterOptions": {
-    "exclude": [
-      "node_modules/**"
-    ]
-  },
-  "rules": {
-    "quotemark": [true, "single"],
-    "indent": [true, "spaces", 2],
-    "interface-name": false,
-    "ordered-imports": false,
-    "object-literal-sort-keys": false,
-    "no-consecutive-blank-lines": false
-  }
-}