the vue cli 3 vue.config.js defination according to document

vue-ts-config.d.ts

import { Configuration as IWbpkConf } from "webpack";
import WebpackChain from "webpack-chain";
import { TransformOptions } from "babel-core";
import { Linter } from "eslint";
import ts from "typescript";

export interface IVueCliConfig {
  baseUrl?: string;
  publicPath?: string;
  outputDir?: string;
  assetsDir?: string;
  indexPath?: string; // index.html path
  filenameHashing?: boolean;
  pages?: IPagesConfig;
  lintOnSave?: boolean | "error";
  runtimeCompiler?: boolean;
  // compiler?: boolean;
  /**
   * By default babel-loader ignores all files inside node_modules.
   * If you want to explicitly transpile a dependency with Babel,
   * you can list it in this option.
   */
  transpileDependencies?: Array<string | RegExp>;
  /**
   * Setting this to false can speed up production builds if you don't need source maps for production.
   */
  productionSourceMap?: boolean;
  /**
   * Configure the crossorigin attribute on <link rel="stylesheet"> and <script> tags in generated HTML.
   * Note that this only affects tags injected by html-webpack-plugin - tags directly added in the source template (public/index.html) are not affected.
   */
  crossorigin?: string;
  /*
	Set to true to enable Subresource Integrity (SRI) on <link rel="stylesheet"> and <script> tags in generated HTML. 
	If you are hosting your built files on a CDN, it is a good idea to enable this for additional security.
	Note that this only affects tags injected by html-webpack-plugin - 
	tags directly added in the source template (public/index.html) are not affected.
	Also, when SRI is enabled, preload resource hints are disabled due to a bug in Chrome which causes 
	the resources to be downloaded twice.
	*/
  integrity?: boolean;
  /*
	If the value is an Object, it will be merged into the final config using webpack-merge.
	If the value is a function, it will receive the resolved config as the argument. 
	The function can either mutate the config and return nothing, 
	OR return a cloned or merged version of the config.
	*/
  configureWebpack?: IWbpkConf | IWebpackConfigFunction;
  chainWebpack?: ChainWebpackFunction;
  css?: ICssConfig;
  devServer?: IDevServerConfig;
  /**
   * Whether to use thread-loader for Babel or TypeScript transpilation.
   * This is enabled for production builds when the system has more than 1 CPU cores.
   */
  parallel?: boolean;
  pwa?: IVueLoaderConfig;
  pluginOptions?: IVueLoaderConfig;
  /**
   * Babel can be configured via babel.config.js.
   */
  // babel?: TransformOptions;
  /**
   * ESLint can be configured via .eslintrc or eslintConfig field in package.json.
   */
  // ESLint?: Linter.Config;

  /**
	 * TypeScript can be configured via tsconfig.json.
	 */
	// typescript?: ITsConfig
}

/**
 * When building in multi-page mode,
 * the webpack config will contain different plugins (
 * 	there will be multiple instances of html-webpack-plugin and preload-webpack-plugin
 * ).
 *  Make sure to run vue inspect if you are trying to modify the options for those plugins.
 */
interface IPagesConfig {
  [name: string]: IPageConfig | string;
  // when using the entry-only string format,
  // template is inferred to be `public/subpage.html`
  // and falls back to `public/index.html` if not found.
  // Output filename is inferred to be `subpage.html`.
  subpage?: string;
}
interface IPageConfig {
  // entry for the page
  entry?: string;
  // the source template
  template?: string;
  // output as dist/index.html
  filename?: string;
  // when using title option,
  // template title tag needs to be <title><%= htmlWebpackPlugin.options.title %></title>
  title?: string;
  // chunks to include on this page, by default includes
  // extracted common chunks and vendor chunks.
  chunks?: string[];
}

/**
 * Some values like host, port and https may be overwritten by command line flags.
 * Some values like publicPath and historyApiFallback should not be modified
 * as they need to be synchronized with publicPath for the dev server to function properly.
 */
interface IDevServerConfig {
  open?: boolean;
  host?: string;
  port?: number;
  https?: boolean;
  hotOnly?: boolean;
  proxy?: string | Object; // TODO: proxy object config https://github.com/chimurai/http-proxy-middleware#proxycontext-config
  before?: () => void;
}

/*
  it will receive the resolved config as the argument. 
	The function can either mutate the config and return nothing, 
	OR return a cloned or merged version of the config.
 */
type IWebpackConfigFunction = (config: IWbpkConf) => IWbpkConf | void;

/*
A function that will receive an instance of ChainableConfig powered by webpack-chain.
Allows for more fine-grained modification of the internal webpack config.
*/
type ChainWebpackFunction = (config: WebpackChain) => WebpackChain;

interface ICssConfig {
  modules?: boolean;
  // TODO: 此处Object待完善
  extract?: boolean | Object;
  sourceMap?: boolean;
  loaderOptions?: IVueLoaderConfig;
}

// TODO: 完善PWA config https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
/**
 * Pass options to the PWA Plugin.
 */
interface IPWAConfig extends Object {}
/**
 * This is an object that doesn't go through any schema validation,
 * so it can be used to pass arbitrary options to 3rd party plugins. For example
 * module.exports = {
 * pluginOptions: {
 * 	foo: {
 * 		// plugins can access these options as
 * 		// `options.pluginOptions.foo`.
 * 			}
 * 		}
 * };
 */
interface IPluginOptions {
  [key: string]: any;
}

interface IVueLoaderConfig {
  [key: string]: any;
  // TODO: 添加如下interface
  // css-loader
  // postcss-loader
  // sass-loader
  // less-loader
  // stylus-loader
}
/**
 * Ts config
 */
interface ITsConfig {
  compilerOptions?: ts.CompilerOptions;
  exclude?: string[];
  compileOnSave?: boolean;
  extends?: string;
  files?: string[];
  include?: string[];
  typeAcquisition?: ts.TypeAcquisition;
}

vue-ts-config.d.ts.md

the vue cli 3 vue.config.js defination according to documentation

this is used by the ts fans who's suffering the new vue configuration;

I spent about 2 hours find these interfaces and types from types and ducument

document : https://cli.vuejs.org/config/#configuration-reference

there are also some todo , i will update it soon;

to use this you need to install at least these packages:

 npm i --save-dev @types/webpack @types/webpack-chain

you need to compile this file to vue.config.js

tsc ./vue.config.ts

vue.config.ts

import { IVueCliConfig } from "./vue_config";

const devConfig: IVueCliConfig = {
  devServer: {
    port: 8082
  }
};
const prodConfig: IVueCliConfig = {};

module.exports = process.env.NODE_ENV == "development" ? devConfig : prodConfig;