Configuration

This module provides configuration options for itself, as well as passing through configuration for ionic.

Configuration for capacitor is set in the usual way, via capacitor.config.ts.

Module Config

This module exposes three keys for configuration: integrations, css and config:

nuxt.config.ts
export default defineNuxtConfig({  modules: ['@nuxtjs/ionic'],  ionic: {    integrations: {      //    },    css: {      //    },    config: {      //    }  },})

integrations

Integrations control which other modules this module should enable and setup from the list below. Disabling them allows you to remove them, or gives you the option to set them up yourself.

  • meta
    Default: true
    Disable to take full control of meta tags.
  • pwa
    Default: true
    Disable to take full control of icon generation, manifest and service worker installation.
  • router
    Default: true
    Disable to configure Ionic Router yourself.
  • icons
    Default: true
    Disable to stop icons from being auto-imported.

css

Configure which Ionic stylesheets are automatically added to your application. For more information about these stylesheets, see the Ionic Documentation for Stylesheets.

  • core
    Default: true
    Disable to import these CSS files manually:
    • @ionic/vue/css/core.css
  • basic
    Default: true
    Disable to import these CSS files manually:
    • @ionic/vue/css/normalize.css
    • @ionic/vue/css/structure.css
    • @ionic/vue/css/typography.css
  • utilities
    Default: false
    Enable to add extra Ionic CSS utilities:
    • @ionic/vue/css/padding.css
    • @ionic/vue/css/float-elements.css
    • @ionic/vue/css/text-alignment.css
    • @ionic/vue/css/text-transformation.css
    • @ionic/vue/css/flex-utils.css
    • @ionic/vue/css/display.css

config

Configure Ionic components globally across your app, such as app mode, tab button layout, etc. For example:

nuxt.config.ts
export default defineNuxtConfig({  ionic: {    config: {      rippleEffect: false,      mode: 'md',      // ...    },  },})
Please see the Ionic Config Options for available keys, values and examples of how they work.

Capacitor Config

Capacitor is configured via the capacitor.config.ts file - this is only required if you are targeting native devices such as iOS or Android.

Please see the Capacitor Config docs for more information.