Debugging in android app

Questions
1

i cant properly debug in the webview inspector because the sourcemap is kind of incomplete. the template files *.f7 are bundled in a index.js file which has all the js functions of the page coded inline in the html and i cant set breakpoints.
additionally when i do debug in store.js and step through the code it only stops about every 3 lines and makes debugging impossible.

i am compiling with cross-env NODE_ENV=development vite build && npx cap copy android && npx cap run android

when i start the app locally (npm run dev) with my browser all files are debug-able in the inspector and not bundled up.

i am using framework7 v7.0.22 and vite

vite.config.js

import path from 'path';
import framework7 from 'rollup-plugin-framework7';

const SRC_DIR = path.resolve(__dirname, './src');
const PUBLIC_DIR = path.resolve(__dirname, './public');
const BUILD_DIR = path.resolve(__dirname, './www',);

export default {
  plugins: [
    framework7({ emitCss: false }),

  ],
  root: SRC_DIR,
  base: '',
  publicDir: PUBLIC_DIR,
  build: {
    outDir: BUILD_DIR,
    assetsInlineLimit: 0,
    emptyOutDir: true,
    rollupOptions: {
      treeshake: false,
    },
    sourcemap: 'inline',
  },
  resolve: {
    alias: {
      '@': SRC_DIR,
    },
  },
  server: {
    host: true,
  },
  esbuild: {
    jsxFactory: '$jsx',
    jsxFragment: '"Fragment"',
  },
  define: {
      global: "window",
  },
};

capacitor.config.json

{
  "appId": "ch.owitec.dentalink.app",
  "appName": "Denta Link",
  "bundledWebRuntime": false,
  "npmClient": "npm",
  "webDir": "www",
  "plugins": {
    "SplashScreen": {
      "launchShowDuration": 0
    },
    "LocalNotifications": {
      "smallIcon": "ic_stat_icon_config_sample",
      "iconColor": "#488AFF",
      "sound": "beep.wav"
    },
    "PushNotifications": {
      "presentationOptions": ["badge", "sound", "alert"]
    }
  },
  "cordova": {},
  "android": {
    "allowMixedContent": true,
    "webContentsDebuggingEnabled": true
  }
}

what can i do to solve this?

2

it seams like the sourcemap only works for js and ts files but not my *.f7 templates. how can i include them as well?

3

i have also notices that rollup-plugin-framework7 thwors following error 13 times:

Sourcemap is likely to be incorrect: a plugin (at position 13) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help

it is the exact number of pages i have. i think it is the x.modules.ts because when i debug it jumps a couplet of lines each time i try to step over line by line. but it could be the f7 template files.

4

the errors are vite not being able to create sourcemaps. i had the idea to copy it unbundled to android but couldnt get it working stable so in the end i went back to webpack and everything is working