import type { VueConfiguration } from 'vue/types/vue'
import type { AppHeadMetaObject } from '../src/types/head'
import type { VueMetaOptions, MetaInfo } from 'vue-meta'
import type { NuxtOptionsLoading, NuxtOptionsLoadingIndicator } from '../src/types/loading'
import type { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
import type { PluginVisualizerOptions } from 'rollup-plugin-visualizer'
import type { PluginOptions } from 'extract-css-chunks-webpack-plugin'
export interface ConfigSchema {
vue: {
/**
* Properties that will be set directly on `Vue.config` for vue@2.
*
*
* @see [vue@2 Documentation](https://v2.vuejs.org/v2/api/#Global-Config)
*/
config: VueConfiguration,
},
app: {
/**
* The base path of your Nuxt application.
*
* This can be set at runtime by setting the NUXT_APP_BASE_URL environment variable.
*
* @default "/"
*
* @example
* ```bash
* NUXT_APP_BASE_URL=/prefix/ node .output/server/index.mjs
* ```
*/
baseURL: string,
/**
* The folder name for the built site assets, relative to `baseURL` (or `cdnURL` if set). This is set at build time and should not be customized at runtime.
*
* @default "/_nuxt/"
*/
buildAssetsDir: string,
/**
* An absolute URL to serve the public folder from (production-only).
*
* For example:
*
* @default ""
*
* @example
* ```ts
* export default defineNuxtConfig({
* app: {
* cdnURL: 'https://mycdn.org/'
* }
* })
* ```
*/
cdnURL: string,
/**
* The folder name for the built site assets, relative to `baseURL` (or `cdnURL` if set).
*
*
* @deprecated - use `buildAssetsDir` instead
*/
assetsPath: any,
/**
* Set default configuration for `` on every page.
*
*
* @example
* ```js
* app: {
* head: {
* meta: [
* //
* { name: 'viewport', content: 'width=device-width, initial-scale=1' }
* ],
* script: [
* //
* { src: 'https://awesome-lib.js' }
* ],
* link: [
* //
* { rel: 'stylesheet', href: 'https://awesome-lib.css' }
* ],
* // please note that this is an area that is likely to change
* style: [
* //
* { children: ':root { color: red }', type: 'text/css' }
* ],
* noscript: [
* //
* { children: 'JavaScript is required' }
* ]
* }
* }
* ```
*/
head: AppHeadMetaObject,
},
/**
* The path to an HTML template file for rendering Nuxt responses. Uses `/app.html` if it exists, or the Nuxt's default template if not.
*
* @default "/home/runner/work/bridge/bridge/packages/bridge-schema/views/app.template.html"
*
* @example
* ```html
*
*
*
* {{ HEAD }}
*
*
* {{ APP }}
*
*
* ```
*/
appTemplatePath: string,
/**
* Enable or disable Vuex store.
*
* By default, it is enabled if there is a `store/` directory.
*
* @default false
*/
store: boolean,
/**
* Options to pass directly to `vue-meta`.
*
*
* @see [documentation](https://vue-meta.nuxtjs.org/api/#plugin-options).
*/
vueMeta: VueMetaOptions,
/**
* Set default configuration for `` on every page.
*
*
* @see [documentation](https://vue-meta.nuxtjs.org/api/#metainfo-properties) for specifics.
*/
head: MetaInfo,
/**
*
* @deprecated - use `head` instead
*/
meta: AppHeadMetaObject,
/**
* Configuration for the Nuxt `fetch()` hook.
*
*/
fetch: {
/**
* Whether to enable `fetch()` on the server.
*
* @default true
*/
server: boolean,
/**
* Whether to enable `fetch()` on the client.
*
* @default true
*/
client: boolean,
},
/**
* You may want to extend plugins or change their order. For this, you can pass a function using `extendPlugins`. It accepts an array of plugin objects and should return an array of plugin objects.
*
*/
extendPlugins: (plugins: Array<{ src: string, mode?: 'client' | 'server' }>) => Array<{ src: string, mode?: 'client' | 'server' }>,
/**
* An object where each key name maps to a path to a layout .vue file.
*
* Normally, there is no need to configure this directly.
*
*/
layouts: Record,
/**
* Set a custom error page layout.
*
* Normally, there is no need to configure this directly.
*
* @default null
*/
ErrorPage: string,
/**
* Configure the Nuxt loading progress bar component that's shown between routes. Set to `false` to disable. You can also customize it or create your own component.
*
*/
loading: NuxtOptionsLoading | false,
/**
* Show a loading spinner while the page is loading (only when `ssr: false`).
*
* Set to `false` to disable. Alternatively, you can pass a string name or an object for more configuration. The name can refer to an indicator from [SpinKit](https://tobiasahlin.com/spinkit/) or a path to an HTML template of the indicator source code (in this case, all the other options will be passed to the template).
*
*/
loadingIndicator: NuxtOptionsLoadingIndicator | false,
/**
* Used to set the default properties of the page transitions.
*
* You can either pass a string (the transition name) or an object with properties to bind to the `` component that will wrap your pages.
*
*
* @see [vue@2 documentation](https://v2.vuejs.org/v2/guide/transitions.html)
*
* @see [vue@3 documentation](https://vuejs.org/guide/built-ins/transition-group.html#enter-leave-transitions)
*/
pageTransition: {
[key: string]: any
},
/**
* Used to set the default properties of the layout transitions.
*
* You can either pass a string (the transition name) or an object with properties to bind to the `` component that will wrap your layouts.
*
*
* @see [vue@2 documentation](https://v2.vuejs.org/v2/guide/transitions.html)
*/
layoutTransition: {
[key: string]: any
},
/**
* You can disable specific Nuxt features that you do not want.
*
*/
features: {
/**
* Set to false to disable Nuxt vuex integration
*
* @default true
*/
store: boolean,
/**
* Set to false to disable layouts
*
* @default true
*/
layouts: boolean,
/**
* Set to false to disable Nuxt integration with `vue-meta` and the `head` property
*
* @default true
*/
meta: boolean,
/**
* Set to false to disable middleware
*
* @default true
*/
middleware: boolean,
/**
* Set to false to disable transitions
*
* @default true
*/
transitions: boolean,
/**
* Set to false to disable support for deprecated features and aliases
*
* @default true
*/
deprecations: boolean,
/**
* Set to false to disable the Nuxt `validate()` hook
*
* @default true
*/
validate: boolean,
/**
* Set to false to disable the Nuxt `asyncData()` hook
*
* @default true
*/
useAsyncData: boolean,
/**
* Set to false to disable the Nuxt `fetch()` hook
*
* @default true
*/
fetch: boolean,
/**
* Set to false to disable `$nuxt.isOnline`
*
* @default true
*/
clientOnline: boolean,
/**
* Set to false to disable prefetching behavior in ``
*
* @default true
*/
clientPrefetch: boolean,
/**
* Set to false to disable extra component aliases like `` and ``
*
* @default true
*/
componentAliases: boolean,
/**
* Set to false to disable the `` component (see [docs](https://github.com/egoist/vue-client-only))
*
* @default true
*/
componentClientOnly: boolean,
},
build: {
/**
* Suppresses most of the build output log.
*
* It is enabled by default when a CI or test environment is detected.
*
* @default true
*
* @see [std-env](https://github.com/unjs/std-env)
*/
quiet: boolean,
/**
* Nuxt uses `webpack-bundle-analyzer` to visualize your bundles and how to optimize them.
*
* Set to `true` to enable bundle analysis, or pass an object with options: [for webpack](https://github.com/webpack-contrib/webpack-bundle-analyzer#options-for-plugin) or [for vite](https://github.com/btd/rollup-plugin-visualizer#options).
*
* @default false
*
* @example
* ```js
* analyze: {
* analyzerMode: 'static'
* }
* ```
*/
analyze: boolean | BundleAnalyzerPlugin.Options | PluginVisualizerOptions,
/**
* Enable the profiler in webpackbar.
*
* It is normally enabled by CLI argument `--profile`.
*
* @default false
*
* @see [webpackbar](https://github.com/unjs/webpackbar#profile)
*/
profile: boolean,
/**
* Enables Common CSS Extraction using [Vue Server Renderer guidelines](https://v2.ssr.vuejs.org/guide/css.html).
*
* Using [extract-css-chunks-webpack-plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin/) under the hood, your CSS will be extracted into separate files, usually one per component. This allows caching your CSS and JavaScript separately and is worth trying if you have a lot of global or shared CSS.
*
* @default false
*
* @example
* ```js
* export default {
* build: {
* extractCSS: true,
* // or
* extractCSS: {
* ignoreOrder: true
* }
* }
* }
* ```
*
* If you want to extract all your CSS to a single file, there is a workaround for this.
* However, note that it is not recommended to extract everything into a single file.
* Extracting into multiple CSS files is better for caching and preload isolation. It
* can also improve page performance by downloading and resolving only those resources
* that are needed.
*
* @example
* ```js
* export default {
* build: {
* extractCSS: true,
* optimization: {
* splitChunks: {
* cacheGroups: {
* styles: {
* name: 'styles',
* test: /\.(css|vue)$/,
* chunks: 'all',
* enforce: true
* }
* }
* }
* }
* }
* }
* ```
*/
extractCSS: boolean | PluginOptions,
/**
* Enables CSS source map support (defaults to true in development)
*
*/
cssSourceMap: any,
/**
* Creates special webpack bundle for SSR renderer. It is normally not necessary to change this value.
*
*/
ssr: any,
/**
* Enable [thread-loader](https://github.com/webpack-contrib/thread-loader#thread-loader) when building app with webpack.
*
* @default false
*
* @warning This is an unstable feature.
*/
parallel: boolean,
/**
* Enable caching for [`terser-webpack-plugin`](https://github.com/webpack-contrib/terser-webpack-plugin#options) and [`cache-loader`](https://github.com/webpack-contrib/cache-loader#cache-loader).
*
* @default false
*
* @warning This is an unstable feature.
*/
cache: boolean,
/**
* Inline server bundle dependencies.
*
* This mode bundles `node_modules` that are normally preserved as externals in the server build.
*
* @default false
*
* @warning Runtime dependencies (modules, `nuxt.config`, server middleware and the static directory) are not bundled.
* This feature only disables use of [webpack-externals](https://webpack.js.org/configuration/externals/) for server-bundle.
*
* @note You can enable standalone bundling by passing `--standalone` via the command line.
*
* @see [context](https://github.com/nuxt/nuxt.js/pull/4661)
*/
standalone: boolean,
/**
* If you are uploading your dist files to a CDN, you can set the publicPath to your CDN.
*
*
* @note This is only applied in production.
*
* The value of this property at runtime will override the configuration of an app that
* has already been built.
*
* @example
* ```js
* build: {
* publicPath: process.env.PUBLIC_PATH || 'https://cdn.nuxtjs.org'
* }
* ```
*/
publicPath: any,
/**
* The polyfill library to load to provide URL and URLSearchParams.
*
* Defaults to `'url'` ([see package](https://www.npmjs.com/package/url)).
*
* @default "url"
*/
serverURLPolyfill: string,
/**
* Customize bundle filenames.
*
* To understand a bit more about the use of manifests, take a look at [this webpack documentation](https://webpack.js.org/guides/code-splitting/).
*
*
* @note Be careful when using non-hashed based filenames in production
* as most browsers will cache the asset and not detect the changes on first load.
*
* This example changes fancy chunk names to numerical ids:
*
* @example
* ```js
* filenames: {
* chunk: ({ isDev }) => (isDev ? '[name].js' : '[id].[contenthash].js')
* }
* ```
*/
filenames: Record string)>,
/**
* Customize the options of Nuxt's integrated webpack loaders.
*
*/
loaders: {
file: {
/** @default false */
esModule: boolean,
},
fontUrl: {
/** @default false */
esModule: boolean,
/** @default 1000 */
limit: number,
},
imgUrl: {
/** @default false */
esModule: boolean,
/** @default 1000 */
limit: number,
},
pugPlain: any,
vue: {
/** @default true */
productionMode: boolean,
transformAssetUrls: {
/** @default "src" */
video: string,
/** @default "src" */
source: string,
/** @default "src" */
object: string,
/** @default "src" */
embed: string,
},
compilerOptions: any,
},
css: {
/** @default 0 */
importLoaders: number,
/** @default false */
esModule: boolean,
},
cssModules: {
/** @default 0 */
importLoaders: number,
/** @default false */
esModule: boolean,
modules: {
/** @default "[local]_[hash:base64:5]" */
localIdentName: string,
},
},
less: any,
sass: {
sassOptions: {
/** @default true */
indentedSyntax: boolean,
},
},
scss: any,
stylus: any,
vueStyle: any,
},
/**
*
* @deprecated Use [style-resources-module](https://github.com/nuxt-community/style-resources-module/)
*/
styleResources: any,
/**
* Add webpack plugins.
*
*
* @example
* ```js
* import webpack from 'webpack'
* import { version } from './package.json'
* // ...
* plugins: [
* new webpack.DefinePlugin({
* 'process.VERSION': version
* })
* ]
* ```
*/
plugins: Array,
/**
* Terser plugin options.
*
* Set to false to disable this plugin, or pass an object of options.
*
*
* @see [terser-webpack-plugin documentation](https://github.com/webpack-contrib/terser-webpack-plugin)
*
* @note Enabling sourcemap will leave `//# sourcemappingURL` linking comment at
* the end of each output file if webpack `config.devtool` is set to `source-map`.
*/
terser: any,
/**
* Enables the [HardSourceWebpackPlugin](https://github.com/mzgoddard/hard-source-webpack-plugin) for improved caching.
*
* @default false
*
* @warning unstable
*/
hardSource: boolean,
/**
* Hard-replaces `typeof process`, `typeof window` and `typeof document` to tree-shake bundle.
*
* @default false
*/
aggressiveCodeRemoval: boolean,
/**
* OptimizeCSSAssets plugin options.
*
* Defaults to true when `extractCSS` is enabled.
*
* @default false
*
* @see [optimize-css-assets-webpack-plugin documentation](https://github.com/NMFR/optimize-css-assets-webpack-plugin).
*/
optimizeCSS: boolean,
/**
* Configure [webpack optimization](https://webpack.js.org/configuration/optimization/).
*
*/
optimization: {
/** @default "single" */
runtimeChunk: string,
/**
* Set minimize to false to disable all minimizers. (It is disabled in development by default)
*
* @default true
*/
minimize: boolean,
/**
* You can set minimizer to a customized array of plugins.
*
*/
minimizer: any,
splitChunks: {
/** @default "all" */
chunks: string,
/** @default "/" */
automaticNameDelimiter: string,
cacheGroups: any,
},
},
/**
* Whether to split code for `layout`, `pages` and `commons` chunks.
*
* Commons libs include `vue`, `vue-loader`, `vue-router`, `vuex`, etc.
*
*/
splitChunks: {
/** @default false */
layouts: boolean,
/** @default true */
pages: boolean,
/** @default true */
commons: boolean,
},
/**
* Nuxt will automatically detect the current version of `core-js` in your project (`'auto'`), or you can specify which version you want to use (`2` or `3`).
*
* @default "auto"
*/
corejs: string,
/**
* Customize your Babel configuration.
*
* See [babel-loader options](https://github.com/babel/babel-loader#options) and [babel options](https://babeljs.io/docs/en/options).
*
*
* @note `.babelrc` is ignored by default.
*/
babel: {
/** @default false */
configFile: boolean,
/** @default false */
babelrc: boolean,
/**
* An array of Babel plugins to load, or a function that takes webpack context and returns an array of Babel plugins.
*
* For more information see [Babel plugins options](https://babeljs.io/docs/en/options#plugins) and [babel-loader options](https://github.com/babel/babel-loader#options).
*
*/
plugins: Array,
/**
* The Babel presets to be applied.
*
*
* @note The presets configured here will be applied to both the client and the server
* build. The target will be set by Nuxt accordingly (client/server). If you want to configure
* the preset differently for the client or the server build, please use presets as a function.
*
* @warning It is highly recommended to use the default preset instead customizing.
*
* @example
* ```js
* export default {
* build: {
* babel: {
* presets({ isServer }, [ preset, options ]) {
* // change options directly
* options.targets = isServer ? '...' : '...'
* options.corejs = '...'
* // return nothing
* }
* }
* }
* }
* ```
*
* @example
* ```js
* export default {
* build: {
* babel: {
* presets({ isServer }, [preset, options]) {
* return [
* [
* preset,
* {
* targets: isServer ? '...' : '...',
* ...options
* }
* ],
* [
* // Other presets
* ]
* ]
* }
* }
* }
* }
* ```
*/
presets: any,
cacheDirectory: any,
},
/**
* Customize PostCSS Loader plugins. Sames options as https://github.com/webpack-contrib/postcss-loader#options
*
*/
postcss: {
execute: any,
postcssOptions: {
[key: string]: any
},
sourcemap: any,
implementation: any,
/** @default "" */
order: string,
},
html: {
/**
* Configuration for the html-minifier plugin used to minify HTML files created during the build process (will be applied for all modes).
*
*
* @warning If you make changes, they won't be merged with the defaults!
*
* @example
* ```js
* export default {
* html: {
* minify: {
* collapseBooleanAttributes: true,
* decodeEntities: true,
* minifyCSS: true,
* minifyJS: true,
* processConditionalComments: true,
* removeEmptyAttributes: true,
* removeRedundantAttributes: true,
* trimCustomFragments: true,
* useShortDoctype: true
* }
* }
* }
* ```
*/
minify: {
/** @default true */
collapseBooleanAttributes: boolean,
/** @default true */
decodeEntities: boolean,
/** @default true */
minifyCSS: boolean,
/** @default true */
minifyJS: boolean,
/** @default true */
processConditionalComments: boolean,
/** @default true */
removeEmptyAttributes: boolean,
/** @default true */
removeRedundantAttributes: boolean,
/** @default true */
trimCustomFragments: boolean,
/** @default true */
useShortDoctype: boolean,
},
},
/**
* Allows setting a different app template (other than `@nuxt/vue-app`)
*
*/
template: any,
/**
* You can provide your custom files to watch and regenerate after changes.
*
* This feature is especially useful for using with modules.
*
*
* @example
* ```js
* watch: ['~/.nuxt/support.js']
* ```
*/
watch: Array,
/**
* See [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) for available options.
*
*/
devMiddleware: {
/** @default "none" */
stats: string,
},
/**
* See [webpack-hot-middleware](https://github.com/webpack-contrib/webpack-hot-middleware) for available options.
*
*/
hotMiddleware: any,
vendor: {
$meta: {
/** @default "vendor has been deprecated since nuxt 2" */
deprecated: string,
},
},
/**
* Set to `'none'` or `false` to disable stats printing out after a build.
*
* @default false
*/
stats: boolean,
/**
* Set to `false` to disable the overlay provided by [FriendlyErrorsWebpackPlugin](https://github.com/nuxt/friendly-errors-webpack-plugin).
*
* @default true
*/
friendlyErrors: boolean,
/**
* Additional extensions (beyond `['vue', 'js']` to support in `pages/`, `layouts/`, `middleware/`, etc.)
*
*/
additionalExtensions: Array,
/**
* Filters to hide build warnings.
*
*/
warningIgnoreFilters: Array,
/**
* Set to true to scan files within symlinks in the build (such as within `pages/`).
*
* @default false
*/
followSymlinks: boolean,
/**
* If you want to transpile specific dependencies with Babel, you can add them here. Each item in transpile can be a package name, a function, a string or regex object matching the dependency's file name.
*
* You can also use a function to conditionally transpile. The function will receive an object ({ isDev, isServer, isClient, isModern, isLegacy }).
*
*
* @example
* ```js
* transpile: [({ isLegacy }) => isLegacy && 'ky']
* ```
*/
transpile: Array string | RegExp | false)>,
},
cli: {
/**
* Add a message to the CLI banner by adding a string to this array.
*
*/
badgeMessages: string[],
/**
* Change the color of the 'Nuxt.js' title in the CLI banner.
*
* @default "green"
*/
bannerColor: string,
},
/**
* Your preferred code editor to launch when debugging.
*
*
* @see [documentation](https://github.com/yyx990803/launch-editor#supported-editors)
*/
editor: string,
/**
* The watch property lets you watch custom files for restarting the server.
*
* `chokidar` is used to set up the watchers. To learn more about its pattern options, see chokidar documentation.
*
*
* @see [chokidar](https://github.com/paulmillr/chokidar#api)
*
* @example
* ```js
* watch: ['~/custom/*.js']
* ```
*/
watch: string[],
/**
* The style extensions that should be resolved by the Nuxt resolver (for example, in `css` property).
*
* @default [".css",".pcss",".postcss",".styl",".stylus",".scss",".sass",".less"]
*/
styleExtensions: Array,
dir: {
/**
* The assets directory (aliased as `~assets` in your build).
*
* @default "assets"
*/
assets: string,
/**
* The directory containing app template files like `app.html` and `router.scrollBehavior.js`
*
* @default "app"
*/
app: string,
/**
* Allows customizing the global ID used in the main HTML template as well as the main Vue instance name and other options.
*
* @default "nuxt"
*/
globalName: string,
/**
* Whether to produce a separate modern build targeting browsers that support ES modules.
*
* Set to `'server'` to enable server mode, where the Nuxt server checks browser version based on the user agent and serves the correct bundle.
* Set to `'client'` to serve both the modern bundle with `