Upgrade to Vue 2.7 and vue-cli 5, v0.11.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openeo/web-editor",
-  "version": "0.11.0",
+  "version": "0.11.1",
   "apiVersions": [
     "1.0.0-rc.2",
     "1.0.0",
@@ -45,7 +45,7 @@
     "@openeo/js-client": "^2.5.1",
     "@openeo/js-commons": "^1.4.1",
     "@openeo/js-processgraphs": "^1.3.0",
-    "@openeo/vue-components": "^2.8.1",
+    "@openeo/vue-components": "^2.10.0",
     "ajv": "^6.12.6",
     "axios": "^0.24.0",
     "chart.js": "^3.7.1",
@@ -55,12 +55,13 @@
     "core-js": "^3.7.0",
     "jsonlint-mod": "^1.7.6",
     "luxon": "^2.4.0",
+    "node-polyfill-webpack-plugin": "^2.0.0",
     "ol": "^6.14.1",
     "ol-ext": "^3.2.20",
     "proj4": "^2.7.5",
     "splitpanes": "^2.3.6",
     "v-clipboard": "^2.2.3",
-    "vue": "^2.6.12",
+    "vue": "^2.7.0",
     "vue-chartjs": "^4.0.5",
     "vue-multiselect": "^2.1.6",
     "vue-snotify": "^3.2.1",
@@ -70,12 +71,11 @@
     "vuex": "^3.5.1"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "^4.5.9",
-    "@vue/cli-service": "^4.5.9",
+    "@vue/cli-plugin-babel": "~5.0.8",
+    "@vue/cli-service": "~5.0.8",
     "epsg-index": "^1.0.0",
     "sass": "^1.35.2",
-    "sass-loader": "^10.2.0",
-    "vue-template-compiler": "^2.6.12"
+    "sass-loader": "^10.2.0"
   },
   "browserslist": [
     "> 2%",

src/components/Logo.vue

@@ -7,14 +7,14 @@
 
 <script>
 import EventBusMixin from './EventBusMixin.vue';
-import { version } from '../../package.json';
+import Package from '../../package.json';
 
 export default {
 	name: 'Logo',
 	mixins: [EventBusMixin],
 	data() {
 		return {
-			version
+			version: Package.version
 		}
 	},
 	methods: {

src/formats/geotiff.js

@@ -2,8 +2,7 @@ import { SupportedFormat } from './format';
 import Utils from '../utils';
 import ProjManager from '../components/maps/projManager';
 
-import { fromUrl as tiffFromUrl } from 'geotiff';
-import { photometricInterpretations } from 'geotiff/dist-module/globals';
+import { fromUrl as tiffFromUrl, globals as _ } from 'geotiff';
 
 import { toUserExtent } from 'ol/proj';
 import Projection from 'ol/proj/Projection';
@@ -178,9 +177,9 @@ class GeoTIFF extends SupportedFormat {
 
 		// Get photometric interpretation
 		switch (this.img.fileDirectory.PhotometricInterpretation) {
-			case photometricInterpretations.CMYK:
-			case photometricInterpretations.YCbCr:
-			case photometricInterpretations.CIELab:
+			case _.photometricInterpretations.CMYK:
+			case _.photometricInterpretations.YCbCr:
+			case _.photometricInterpretations.CIELab:
 				this.convertToRGB = true;
 				break;
 			default:

vue.config.js

@@ -1,4 +1,4 @@
-const webpack = require('webpack');
+const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')
 
 module.exports = {
 	// Path where this instance of the web editor is hosted (string)
@@ -26,6 +26,14 @@ module.exports = {
 				maxInitialRequests: 8,
 				maxAsyncRequests: 1
 			}
+		},
+		resolve: {
+			fallback: {
+				fs: false
+			}
 		}
+	},
+	chainWebpack: webpackConfig => {
+		webpackConfig.plugin('polyfills').use(NodePolyfillPlugin);
 	}
 }