访问 Quasar（或 Vue 3）应用程序名称变量的最佳方式是什么？

Question

如何在Quasar中实现类似的功能，而不需要重新定义每个组件中的变量：

<template>
    <div>Welcome to {{ APP_NAME }}.</div>
</template>

我的应用程序是使用 Quasar CLI 设置的，它在设置过程中要求输入应用程序名称，因此我想它会作为全局变量或我可以访问的内容存储在某个位置。

如果做不到这一点，也许 Vue 3 有办法做到这一点。

Answer 1

Quasar 不明确使用 main.js 文件。使用 quasar cli 创建项目时，大多数建议的答案都不起作用。使用 quasar.config.js 可能可行，但它仍然不是正确的地方。

由于您使用了 quasar cli，因此您需要使用 quasar new boot 添加启动文件。

这将在 src/boot 文件夹中生成文件 ezglobals.js： quasar new boot ezglobals

编辑后，您的 ezglobals.js 文件中的代码将如下所示：

import { boot } from 'quasar/wrappers'
export default boot(({ app }) => {
  app.config.globalProperties.$APP_NAME = 'The name of your app';
})

最后在 quasar.config.js 中将 ezglobals.js 添加到启动数组中：

...
boot: [
      'ezglobals.js'
    ]
...