Skip to content

vixt / core / AppOptions

AppOptions

Properties

baseURL?

optional baseURL?: string

The base path of your Vixt application.

Default

ts
'/'

Example

ts
export default defineVixtConfig({
  app: {
    baseURL: '/prefix/',
  },
})

css?

optional css?: string[]

You can define the CSS files/modules/libraries you want to set globally.

Example

ts
export default defineVixtConfig({
  css: [
    // CSS file in the project
    '~/styles/main.css',
    // SCSS file in the project
    '~/styles/main.scss',
  ],
})

entryCode?

optional entryCode?: string

The default entry code


entryFile?

optional entryFile?: string

The entry file relative to <srcDir>

Default

ts
'main.ts' // in vue
'main.tsx' // in react
'index.ts' // in vitepress

Example

ts
'entry.ts' // relative to '/<srcDir>/entry.ts'

optional head?: AppHead

Set default configuration for <head>.

Default

json
{
  "meta": [
    { "charset": "utf-8" },
    { "name": "viewport", "content": "width=device-width, initial-scale=1" }
  ]
}

Example

ts
export default defineVixtConfig({
  app: {
    head: {
      meta: [
        // <meta name="viewport" content="width=device-width, initial-scale=1">
        { name: 'viewport', content: 'width=device-width, initial-scale=1' }
      ],
      script: [
        // <script src="https://awesome-lib.js"></script>
        { src: 'https://awesome-lib.js' }
      ],
      link: [
        // <link rel="stylesheet" href="https://awesome-lib.css">
        { rel: 'stylesheet', href: 'https://awesome-lib.css' }
      ],
      style: [
        // <style type="text/css">:root { color: red }</style>
        { children: ':root { color: red }', type: 'text/css' }
      ],
      noscript: [
        // <noscript>JavaScript is required</noscript>
        { children: 'JavaScript is required' }
      ],
      title: [
        // <title>Website Title</title>
        { children: 'Website Title' }
      ]
    }
  }
})

loadingTemplate?

optional loadingTemplate?: string

The path to an HTML file with the contents of which will be inserted into index.html. Some good sources for spinners are SpinKit or SVG Spinners.


rootId?

optional rootId?: string

Customize Vixt root element id.

Default

ts
'app'

rootTag?

optional rootTag?: string

Customize Vixt root element tag.

Default

ts
'div'

transformEntryFile?

optional transformEntryFile?: boolean

Whether to enable generate and transform entry file

Default

ts
true

transformIndexHtml?

optional transformIndexHtml?: boolean

Whether to enable transform and transform index.html

Default

ts
true