Replace the deprecated vue-cli-service with the vite tool currently recommended for Vue 2

[gaurav]

Klados has so far used the vue-cli-service tool along with the Babel JavaScript compiler to run and build Klados, which was the recommended setup when we first moved Klados to Vue 2. The vue-cli-service tool is now in maintenance mode, and npm upgrade cannot be used to upgrade vue-cli-service to an alternate control tool. As detailed at https://github.com/phyloref/klados/pull/303, I ended up creating a new Vue 2 project -- which uses the Vite tool to run and build the project -- and then used that as a template to replace vue-cli-service with vite. In addition to the changes in package.json, this also required additional changes:

• Updates to the targets and settings in package.json.
• Changed some import paths in Vue files, and require()s needed to be replaced with imports.
• We previously loaded configuration settings as a Vue variable (this.$config), but this no longer seems to work. I now import the constants directly in every file that they are needed. This allowed the config.js file to become a bit more readable.
• Some changes in dependencies:
  • csv-stringify no longer works, so I replaced it with a simple TSV export.
  • zlib no longer works, so I replaced it with the pako library.
  • x-hub-signature no longer works, so I replaced it with the crypto-js package.
• Some changes in locations and formats of files:
  • Moved index.html from public/ into the root directory.
  • Replaced .eslintrc.json with .eslint.cjs as recommended, and CJS allows comemnts.

We still don't have unit tests for everything, so I can't be sure that everything is working fully after this change, but the basic functionality (loading files, resolving phyloreferences) all seems to work, and we'll be testing most of the functionality in the remaining work before we submit the manuscript. So I'm not too worried about missing something.

Why this PR exists

Klados has so far been using the vue-cli-service tool along with the Babel JavaScript compiler to run and build Klados that was in use when we first moved Klados to Vue 2. Unfortunately, the vue-cli-service tool -- now in maintenance mode -- and Babel combined with ESLint required a pretty complicated set of dependencies, making upgrades difficult and resulting in a large number of vulnerabilities in our dependencies (97 vulnerabilities (1 low, 65 moderate, 26 high, 5 critical), according to npm audit), and consequently a large number of dependency updates in https://github.com/phyloref/klados/pulls?q=is%3Apr+is%3Aopen+label%3Adependencies that only running npm upgrade never quite fixed.

This seemed the most expeditious way forward, but recently something changed on my laptop, and attempting to run Klados gives me an OpenSSL error from within Babel:

Error: error:0308010C:digital envelope routines::unsupported

opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'

As far as I can tell (based on StackOverflow answers such as this one), this indicates that some component of our Babel installation is out of date. I spent some time trying to figure out how to modify package.json to upgrade Babel to avoid this error, but ran into another set of errors involving Node functions that were no longer being polyfilled in JavaScript for browsers. While I can use Node 16 to run Klados without this error, I suspect that this is only a temporary fix that will stop working at some point (if not before September 2023, when Node 16 will no longer be maintained, then certainly after that).

In frustration, I created a new Vue 2 application using the currently recommended method (running npm create vue@2), and copied the packages from package.json into our current Klados code. This uses the Vite tool to manage starting and building Vue 2 applications. This has resulted in a number of errors -- I'm not sure why they didn't appear earlier, but I suspect that Babel was more permissible in mixing import and require than Vite is. I'm still missing some polyfills -- e.g. Gzipping is no longer supported, which we need to upload our ontology to the reasoner for processing -- but I think I'm much closer to getting Klados fully functional again using this approach. Vite is also much faster than Babel, appears much easier to use and configure, and has zero audit errors.

I will continue working on this branch until (1) I find an issue with this approach that I can't work around, or (2) we come up with another solution for this whole mess.

[hlapp]

• csv-stringify no longer works, so I replaced it with a simple TSV export

I see, so I think this is the answer - we didn't decide to drop CSV, but you believe it was made necessary. Are you saying the csv-stringify package no longer works? Can you elaborate on the issue?

I am asking because I'd argue CSV is the more "standard" standard for tabular data, and it'd be somewhat sad to have to leave it behind.

[gaurav]

• csv-stringify no longer works, so I replaced it with a simple TSV export

I see, so I think this is the answer - we didn't decide to drop CSV, but you believe it was made necessary. Are you saying the csv-stringify package no longer works? Can you elaborate on the issue?

I am asking because I'd argue CSV is the more "standard" standard for tabular data, and it'd be somewhat sad to have to leave it behind.

The problem was that csv-stringify appears to depend on Buffer, which is no longer present in browsers. I'd planned to create an issue to restore CSV export later, but then I discovered the Browser ESM distribution, which includes polyfills for things like Buffer. So I was able to restore CSV export in 44d8d85!