@quasar/app-webpack/lib/modes/cordova/cordova-devserver.js

Quasar Framework App CLI with Webpack

const cloneDeep = require('lodash/cloneDeep.js')
const webpack = require('webpack')
const WebpackDevServer = require('webpack-dev-server')

const { AppDevserver } = require('../../app-devserver.js')
const { CordovaConfigFile } = require('./config-file.js')
const { log, fatal } = require('../../utils/logger.js')
const { spawn } = require('../../utils/spawn.js')
const { onShutdown } = require('../../utils/on-shutdown.js')
const { openIDE } = require('../../utils/open-ide.js')
const { quasarCordovaConfig } = require('./cordova-config.js')
const { fixAndroidCleartext } = require('./android-cleartext.js')

module.exports.QuasarModeDevserver = class QuasarModeDevserver extends AppDevserver {
  #pid = 0
  #server = null
  #target
  #cordovaConfigFile = new CordovaConfigFile()

  constructor (opts) {
    super(opts)

    this.registerDiff('cordova', quasarConf => [
      quasarConf.metaConf.APP_URL,
      quasarConf.cordova
    ])

    this.#target = this.ctx.targetName

    if (this.#target === 'android') {
      fixAndroidCleartext(this.ctx.appPaths, 'add')
    }

    onShutdown(() => {
      this.#stopCordova()
    })
  }

  run (quasarConf, __isRetry) {
    const { diff, queue } = super.run(quasarConf, __isRetry)

    if (diff('webpack', quasarConf)) {
      return queue(() => this.#runWebpack(quasarConf))
    }

    if (diff('cordova', quasarConf)) {
      return queue(() => this.#runCordova(quasarConf))
    }
  }

  async #runWebpack (quasarConf) {
    if (this.#server !== null) {
      await this.#server.stop()
      this.#server = null
    }

    const webpackConf = await quasarCordovaConfig.webpack(quasarConf)

    let started = false

    return new Promise(resolve => {
      const compiler = webpack(webpackConf)

      compiler.hooks.done.tap('done-compiling', stats => {
        if (started === true) return

        // start dev server if there are no errors
        if (stats.hasErrors() === true) return

        started = true
        resolve()
      })

      // start building & launch server
      // deep clone to avoid webpack-dev-server mutating the original config which causes double compilation
      this.#server = new WebpackDevServer(cloneDeep(quasarConf.devServer), compiler)
      this.#server.start()
    })
  }

  async #runCordova (quasarConf) {
    this.#stopCordova()

    if (this.argv.ide) {
      await this.#runCordovaCommand(
        quasarConf,
        [ 'prepare', this.#target ].concat(this.argv._)
      )

      await openIDE({
        mode: 'cordova',
        bin: quasarConf.bin,
        target: this.#target,
        dev: true,
        appPaths: this.ctx.appPaths
      })

      return
    }

    const args = [ 'run', this.#target ]

    if (this.ctx.emulator) {
      args.push(`--target=${ this.ctx.emulator }`)
    }

    await this.#runCordovaCommand(
      quasarConf,
      args.concat(this.argv._)
    )
  }

  #stopCordova () {
    if (this.#pid) {
      log('Shutting down Cordova process...')
      process.kill(this.#pid)
      this.#cleanup()
    }
  }

  #runCordovaCommand (quasarConf, args) {
    this.#cordovaConfigFile.prepare(quasarConf)

    if (this.#target === 'ios' && quasarConf.cordova.noIosLegacyBuildFlag !== true) {
      args.push('--buildFlag=-UseModernBuildSystem=0')
    }

    return new Promise(resolve => {
      this.#pid = spawn(
        'cordova',
        args,
        { cwd: this.ctx.appPaths.cordovaDir },
        code => {
          this.#cleanup()
          if (code) {
            fatal('Cordova CLI has failed', 'FAIL')
          }
          resolve()
        }
      )
    })
  }

  #cleanup () {
    this.#pid = 0
    this.#cordovaConfigFile.reset()
  }
}