Vue + Electron + TypeORM, nice combo with small tricks

Found very neat combination of modern technologies that makes cross-platform desktop app development much easier:
- VueJS
- Electron
- TypeORM

VueJS actually has tutorial for creation of simple project, quick steps are:

$ npm install -g @vue/cli @vue/cli-init

$ vue init simulatedgreg/electron-vue test-electron-app

However, once I combined all of that together couldn't make TypeORM to work as it appeared it does mocking if thinks it works in 'browser' mode and disables all its drivers.

Symptom of this is the following error:

TypeError: this.driver.connect is not a function

Spent few days on that, and eventually found resolution. You need to change vue.config.js (which is webpack representative for Vue) and mark typeorm + whatever driver package you use as externals in this way -

  "transpileDependencies": [

    "vuetify"

  ],

  configureWebpack: config => {

    config.externals = {

      typeorm: "require('typeorm')",

      mysql: "require('mysql')"

    }

  }

}

After that all those packages combined will work as expected, giving you all flexbility of Vue, cross-platform and desktop support of Electron as well as powerful ORM with whatever database you've.