如何在没有Quasar CLI的情况下配置Quasar插件？

Question

我使用vue add quasar将Quasar添加到了我先前存在的Vue CLI项目中。

现在我正在尝试使用Loading plugin，但是我无法使用它。

这是与Quasar / Vue设置有关的内容：

import { Quasar } from 'quasar'

Vue.use(Quasar, {
  config: {},
  components: { /* not needed if importStrategy is not 'manual' */ },
  directives: { /* not needed if importStrategy is not 'manual' */ },
  plugins: {},
  cssAddon: true,
  extras: [
    'ionicons-v4',
    'material-icons',
    'material-icons-outlined',
    'material-icons-round',
    'material-icons-sharp',
    'mdi-v3',
    'eva-icons',
    'fontawesome-v5',
    'themify'
  ]
})

我尝试使用以下选项无济于事。有什么想法吗？

import { Quasar } from 'quasar'

Vue.use(Quasar, {
  ...,
  framework: {
    plugins: [
      'Loading'
    ]
  },
  ...
})

和

import { Quasar } from 'quasar'

Vue.use(Quasar, {
  ...
  plugins: ['Loading'],
  ...
})

Answer 1

因为我没有使用quasar-cli将Quasar添加到我的应用程序中，所以我不得不对插件进行全局调用。这就是我最终的工作方式，这与@Alex Brohshtut在他的评论中建议的一样。

main.ts

import { Loading } from 'quasar';

http.interceptors.request.use(config => {
  Loading.show({
    delay: 500,
    message: 'Please wait...'
  });
  return config
})

http.interceptors.response.use(response => {
  Loading.hide();
  return response
})