Got it working like this.

quasar.conf.js:

    boot: [
      'auth',
      'i18n',
      'axios',
      {
        server: false,
        path: 'echarts'
      }
    ],

boot file:

// https://github.com/xlsdg/vue-echarts-v3
import * as ECharts from 'echarts/lib/echarts'
import Wrapper from 'vue-echarts-v3/src/wrapper.js'

const DIEcharts = Wrapper(ECharts)
DIEcharts.__echarts__ = ECharts

export default ({ Vue }) => {
  // register component to use
  Vue.component('di-echart', DIEcharts)
}

somponent:

<template>
  <q-card class="q-pa-sm" style="background:#eeeeee">
    <q-card-section class="q-pa-none q-pt-md">
      <q-no-ssr>
        <di-echart
          v-if="getLineChartOptions"
          style="height: 250px;"
          :option="getLineChartOptions"
          :resizable="true"
        ></di-echart>
      </q-no-ssr>
    </q-card-section>
  </q-card>
</template>
<script>
import 'echarts/lib/chart/line'
import 'echarts/lib/component/tooltip'
export default {
.......

Please confirm if this is a solid solution?

So, this works. Dragging the window lower than 800px changes to image 1x:

  <picture>
        <source media="(max-width: 799px)" srcset="https://cdn.quasar.dev/img/image-1x.png">
        <source media="(min-width: 800px)" srcset="https://cdn.quasar.dev/img/image-2x.png">
        <img src="https://cdn.quasar.dev/img/image-src.png" style="height: 255px">
      </picture>

but this from docs won’t work:

<q-img
        src="https://cdn.quasar.dev/img/image-src.png"
        srcset="https://cdn.quasar.dev/img/image-1x.png 799w,
                https://cdn.quasar.dev/img/image-2x.png 800w"
        sizes="(max-width: 799px) 799w,
              (min-width: 800px) 800w"
        style="height: 255px"
      >
        <div class="absolute-bottom text-body1 text-center">
          With srcset & sizes
        </div>
      </q-img>

what am i doing wrong?

Hi guys,
Vuetify has som ready templates for sale like this: https://store.vuetifyjs.com/collections/themes

Are there any Quasar templates for sale?

Now i use:

.q-notifications .q-btn
  text-transform: none

in sass file but is there a more “correct way” to do this?

Hi guys, i don’t like capital letters on buttons so i use “no-caps” but how can i do this on notify actions label?

this.$q.notify({
          message: this.$t('general.cookieAccept'),
          color: 'orange',
          multiLine: true,
          icon: 'announcement',
          actions: [
            { label: this.$t('general.cookieAcceptRead'), color: 'white', handler: () => { this.$router.replace('/error') } },
            { label: this.$t('general.cookieAcceptYes'), color: 'white', handler: () => { cookieInstance.set('cookie-accept', 1) } }
          ]
        })

Full screen scroll now works without this:

<q-page class="fullscreen" style="overflow: auto;">

can someone please confirm this.

@Allan-EN-GB sorry, totally forgot.

Yes, i have 2 questions:

1. have you done some paginations yet?

2. in Adonis i have separated my API in 3 parts.

a. Auth that applies to both www.website.com and admin.website.com.

b. Site that applies to www.website.com.

c. Admin that applies to admin.website.com.

I have found a repo for NestJS that looks like it has similar setup if you look here: https://github.com/jasoncarty/booking-system-api/tree/master/src/components

I don’t want to start from scratch as a newbie in NestJS, i would like to find a solid boilerplate to build on, do you think this is a good alternative?

Still using NestJS as backend for Quasar @fredericomaia ?

i get the feeling that i need to do something like export in my boot file to be able to use google.maps.XXXXX in my components?

I don’t think so it works fine without:

<script>
// import { gmapApi } from 'vue2-google-maps'

maybe i misunderstood you, the import is in my map component vue and not in my boot file?