此页面引用src/index.js文件，该文件在quasar dev和quasar build上执行。 这是主进程，您可以在其中修改构建以适合您的应用扩展的需求。 例如，注册启动文件、修改Webpack进程、注册CSS、注册UI组件、注册Quasar CLI命令等。

文件的基本结构示例：

module.exports = function (api) {
  // 如下所述的“api”对象的属性和方法
}

api.ctx

与/quasar.conf.js中的ctx相同。 帮助您根据quasar dev或quasar build运行的上下文做出决策。

示例：如果仅在electron模式下运行，则可能要使用一种api方法。

if (api.ctx.dev === true && api.ctx.mode === 'electron') {
  api.beforeDev((api) => {
    // 在运行quasar dev并使用电子模式时
    // 做一些事情
  })
}

api.extId

包含此应用扩展的ext-id（字符串）。

api.prompts

是一个对象，具有在安装此应用扩展后提示的答案。 有关提示的更多信息，请查看提示API。

api.resolve

解析此应用扩展运行的应用内的路径。 无需导入path并自己解析路径。

// 解析到应用的根目录
api.resolve.app('src/my-file.js')

// 解析为应用的root/src
api.resolve.src('my-file.js')

// 解析为应用的root/src-pwa
api.resolve.pwa('some-file.js')

// 解析为应用的root/src-ssr
api.resolve.ssr('some-file.js')

// 解析为应用的root/src-cordova
api.resolve.cordova('config.xml')

// 解析为应用的root/src-electron
api.resolve.electron('some-file.js')

api.appDir

包含运行此应用扩展的应用根目录的完整路径（字符串）。

api.compatibleWith

通过一个semver条件确定应用扩展与宿主应用程序中安装的软件包兼容。

如果不满足semver条件，则@quasar/app将出错并暂停执行。

semver条件的示例：'1.x || >=2.5.0 || 5.0.0 - 7.2.3'.

/**
 * @param {string} 包名
 * @param {string} semver条件
 */
api.compatibleWith('@quasar/app', '1.x')

api.hasPackage

通过一个semver条件确定宿主应用程序中是否安装了某些软件包。

semver条件的示例： '1.x || >=2.5.0 || 5.0.0 - 7.2.3'.

/**
 * @param {string} 包名
 * @param {string} (optional) semver条件
 * @return {boolean} 软件包已安装并且符合可选的semver条件
 */
if (api.hasPackage('vuelidate')) {
  // 嘿，这个应用有（任何版本）
}
if (api.hasPackage('quasar', '^1.0.0')) {
  // 嘿，这个应用已安装v1版本
}

api.hasExtension

检查是否已npm安装了另一个应用扩展，并且Quasar CLI已调用它。

/**
 * 检查是否安装了另一个应用扩展
 *
 * @param {string} extId
 * @return {boolean} 已安装并调用扩展
 */
if (api.hasExtension(extId)) {
  // 嘿，我们有它
}

api.getPackageVersion

获取宿主应用程序包的版本。

/**
 * @param {string} 包名
 * @return {string|undefined} 应用程序包的版本
 */
console.log( api.getPackageVersion(packageName) )
// 输出示例：
//   1.1.3
//   undefined (当包找不到的时候)

api.extendQuasarConf

扩展quasar.conf.js

/**
 * @param {function} 函数
 *   (cfg: Object, ctx: Object) => undefined
 */
api.extendQuasarConf ((conf, api) => {
  //用quasar.conf.js做一些事情：
  //添加、更改任何内容
})

注册启动和CSS文件

module.exports = function (api, ctx) {
  api.extendQuasarConf((conf, api) => {
    // 确保已注册my-ext启动文件
    conf.boot.push('~quasar-app-extension-my-ext/src/boot/my-ext-bootfile.js')

    // 确保启动文件转译
    conf.build.transpileDependencies.push(/quasar-app-extension-my-ext[\\/]src[\\/]boot/)
    // 如果启动文件导入任何内容，
    // 请确保上面的正则表达式也与这些文件匹配！

    // 确保my-ext css通过webpack
    conf.css.push('~quasar-app-extension-my-ext/src/component/my-ext.styl')
  })
}

api.chainWebpack

链式Webpack配置

/**
 * @param {function} 函数
 *   (cfg: ChainObject, invoke: Object {isClient, isServer}) => undefined
 */
api.chainWebpack((cfg, { isClient, isServer }, api) => {
  // 添加/删除/更改cfg（Webpack链对象）
})

该配置是Webpack链对象。 在webpack-chain文档中描述了它的API。

api.extendWebpack

扩展webpack配置

/**
 * @param {function} 函数
 *   (cfg: Object, invoke: Object {isClient, isServer}) => undefined
 */
api.extendWebpack((cfg, { isClient, isServer }, api) => {
  // 添加/删除/更改cfg（Webpack配置对象）
})

api.chainWebpackMainElectronProcess

主electron进程的链式Webpack配置

/**
 * @param {function} 函数
 *   (cfg: ChainObject) => undefined
 */
api.chainWebpackMainElectronProcess((cfg, { isClient, isServer }, api) => {
  // 添加/删除/更改cfg（Webpack配置对象）
})

api.extendWebpackMainElectronProcess

扩展主electron进程webpack配置对象

/**
 * @param {function} 函数
 *   (cfg: Object) => undefined
 */
api.extendWebpackMainElectronProcess((cfg, { isClient, isServer }, api) => {
  // 添加/删除/更改cfg（Webpack配置对象）
})

api.chainWebpackWebserver

@quasar/app v1.5+

SSR Web服务器的链式Webpack配置（/src-ssr的内容）

/**
 * @param {function} fn
 *   (cfg: ChainObject) => undefined
 */
api.chainWebpackWebserver ((cfg, { isClient, isServer }, api) => {
  // 添加/删除/更改cfg（Webpack链对象）
})

api.extendWebpackWebserver

@quasar/app v1.5+

扩展SSR Web服务器的Webpack配置对象（/src-ssr的内容）

/**
 * @param {function} fn
 *   (cfg: Object) => undefined
 */
api.extendWebpackWebserver((cfg, { isClient, isServer }, api) => {
   //添加/删除/更改cfg（Webpack配置对象）
})

api.registerCommand

注册一个即将可用的命令quasar run <ext-id> <cmd> [args]（或更短的形式：quasar <ext-id> <cmd> [args]）。

/**
 * @param {string} 命令名
 * @param {function} fn
 *   ({ args: [ string, ... ], params: {object} }) => ?Promise
 */
api.registerCommand('start', ({ args, params }) => {
  // 在这里做点什么

  // 这将注册“start”命令
  // 并在运行$ quasar run <ext-id> start
  // 时执行此处理程序
})

api.registerDescribeApi

为$ quasar describe命令注册一个API文件。

/**
 * @param {string} 名称
 * @param {string} 相对路径
 *  （从具有此调用的文件开始的相对路径）
 */
api.registerDescribeApi(
  'MyComponent',
  './relative/path/to/my/component/file.json'
)

上面的代码将响应$ quasar describe MyComponent.

有关此类JSON文件的语法，请查看/node_modules/quasar/dist/api (在您的项目文件夹中). （在您的项目文件夹中）。 请注意，您的JSON必须包含一个type属性（“component”、“directive”、“plugin”）。 例如：

{
  "type": "component",
  "props": {
  },
  ...
}

api.getPersistentConf

获取此扩展的内部持久配置。 如果没有，则返回空对象。

/**
 * @return {object} 配置
 */
api.getPersistentConf()

api.setPersistentConf

设置此扩展的内部持久配置。 如果已经存在，则将其覆盖。

/**
 * @param {object} 配置
 */
api.setPersistentConf({
  // ....
})

api.mergePersistentConf

深度合并到此扩展的内部持久配置中。 如果扩展尚未设置任何配置，则从本质上讲，这等同于首次设置。

/**
 * @param {object} 配置
 */
api.mergePersistentConf({
  // ....
})

api.beforeDev

在$ quasar dev命令运行之前，准备外部服务，例如启动一些后端或应用程序依赖的任何其他服务。

可以使用async/await或直接返回Promise。

/**
 * @param {function} 函数
 *   (api, { quasarConf }) => ?Promise
 */
api.beforeDev((api, { quasarConf }) => {
  // 做一点事
})

api.afterDev

在Quasar开发服务器启动（$ quasar dev）后运行钩子。 至此，开发服务器已经启动并可用了，您可以对其进行操作。

可以使用async/await或直接返回Promise。

/**
 * @param {function} 函数
 *   (api, { quasarConf }) => ?Promise
 */
api.afterDev((api, { quasarConf }) => {
  // 做一点事
})

api.beforeBuild

在Quasar构建用于生产环境的应用程序（$ quasar build）之前运行钩子。 此时，尚未创建可分发文件夹。

可以使用async/await或直接返回Promise。

/**
 * @param {function} 函数
 *   (api, { quasarConf }) => ?Promise
 */
api.beforeBuild((api, { quasarConf }) => {
  // 做一点事
})

api.afterBuild

在Quasar构建用于生产的应用程序后运行钩子（$ quasar build）。 此时，已创建了可分发文件夹，如果您希望对其进行操作，则可以使用该文件夹。

可以使用async/await或直接返回Promise。

/**
 * @param {function} 函数
 *   (api, { quasarConf }) => ?Promise
 */
api.afterBuild((api, { quasarConf }) => {
  // 做一点事
})

api.onPublish

@quasar/app v1.0.0-rc.7+

在Quasar构建用于生产环境的应用并执行afterBuild钩子（如果指定）之后，如果请求发布（$ quasar build -P），则运行钩子。

可以使用async/await或直接返回Promise。

/**
 * @param {function} 函数
 *   () => ?Promise
 * @param {object} opts
 *   * arg - 提供给“--publish”/“-P”参数的参数值
 *   * distDir - 生成可分发内容的文件夹
 */
api.onPublish((api, opts) => {
  // 做一点事
})