Quasar: How can I add Q Vue Components (>= 1.0.5) to existing Vue-CLI project? [docs]

[gitincognito]

Hello!

I have question same as https://github.com/quasarframework/quasar/issues/1576 but for Quasar >= v.1.0.5

I have existing Vue-CLI (on Nuxt) project and want add Quasar Vue Components https://quasar.dev/vue-components on it -- how can I do it?

The answer in https://github.com/quasarframework/quasar/issues/1576#issuecomment-388550633 is satisfied for me, but it for the v.0.17 of Quasar, and is'nt working with Quasar >= v.1.0.5

Can you write a little step by step guide?

Thank you!

[nothingismagick]

There is no mat or ios any more, and the ui repo is called quasar now.

import "quasar/dist/quasar.css";

import Quasar, { QLayout, QInput, QBtn } from "quasar/dist/quasar.esm";
Vue.use(Quasar, { components: [QLayout, QInput, QBtn] });

I don't use Nuxt, so I would be very obliged to know if it works for you, and if so will be sure to make it available in the docs.

[rstoenescu]

import {
  Quasar, 
  QLayout
 // ....
} from 'quasar'

Vue.use(Quasar, {
  config: {},
  components: {
    QLayout,
    // ...
  },
  directives: {
     // ...
  },
  plugins: {
    // ...
  }
 })

[rstoenescu]

Also, if you already have a Vue CLI project and want to use Quasar, you can install the Quasar Vue CLI plugin.

[gitincognito]

import {
  Quasar, 
  QLayout
 // ....
} from 'quasar'

Vue.use(Quasar, {
  config: {},
  components: {
    QLayout,
    // ...
  },
  directives: {
     // ...
  },
  plugins: {
    // ...
  }
 })

I do it, but console output:

export 'Quasar' was not found in 'quasar'

what is wrong?

[gitincognito]

I correct it:

import Vue from 'vue';
import "quasar/dist/quasar.css";
import Quasar, {
    QLayout,
    QBtn
    // ....
} from 'quasar'

Vue.use(Quasar, {
    config: {},
    components: {
        QLayout,
        QBtn
        // ...
    },
    directives: {
        // ...
    },
    plugins: {
        // ...
    }
})

Its working now -) Thank you so much!

[rstoenescu]

Depends if you enabled the treeshaking on Quasar or not...