Rspack bundling and dynamic imports

mobile Cordova
1

If I dynamically import a JS module and/or a Vue component for a specific platform, will the code still be bundled into that platform’s build (e.g., Cordova, Desktop, etc.), or can I ensure that it is completely excluded from the resulting bundle?

For example:

if (Meteor.isCordova) {
  const AppEntry = () => import('./entry.vue')

  appRoutes.push({
    path: '/entry',
    component: AppEntry
  })
}

or

<component  v-if='PaymentComponent' :is='PaymentComponent'/>

import { defineAsyncComponent } from 'vue'
import { Meteor } from 'meteor/meteor'

const PaymentAsync = defineAsyncComponent(function () {
  return import('/client/components/payment/index.vue')
})

export default {
  name: 'Content',
  computed: {
    PaymentComponent () {
      return Meteor.isCordova ? null : PaymentAsync
    }
  }
}

In these examples, will Rspack make “proper” bundles for Cordova, namely:

  • including AppEntry routes/components and
  • excluding the PaymentComponent?

So is it possible to ensure that no remnants of payment provider code or packages are included in the Cordova builds? Or do we need to, or even can we, configure Rspack explicitly for this to work?