@rstoenescu I need something more complete. For example:
https://introjs.com/
http://linkedin.github.io/hopscotch

The effect of highlighting an element such as introjs. I’ll try a vue-tour to see if I can adapt it.

Thanks for your attention

I share the solution I found using the constant or env helper css.

import { Platform } from ‘quasar’

export default {
fixSafeArea (top, element) {
if (!Platform.is.iphone) {
return
}
const wrapper = document.querySelector(element)
const style = top ? [
top: calc(${top} + constant(safe-area-inset-top));,
top: calc(${top} + env(safe-area-inset-top));
].join(’’) : [
‘top: constant(safe-area-inset-top);’,
‘top: env(safe-area-inset-top);’
].join(’’)
if (!wrapper) {
console.error(‘wrapper not found’, element)
return
}
wrapper.setAttribute(‘style’, style)
return wrapper
}
}

Hi guys, I’m integrating the Jodit editor.

But when executing quasar dev, the following warning appears in the console.

WARNING Compiled with 1 warnings 11:10:33 PM

  warning in ./node_modules/jodit/build/jodit.min.css

Module Warning (from ./node_modules/postcss-loader/src/index.js):
Warning

They know how I can avoid that message. They know how I can avoid that message. It occurred to me that this error is possible to mitigate if webpack is configured to ignore it. I found that it is possible to use the stats property, but I can’t configure it correctly.

I am trying to create a minimum version of a Google Docs.

You can see the application running at App link.

in the same situation

I share the solution I found using the constant or env helper css.

import { Platform } from ‘quasar’

export default {
fixSafeArea (top, element) {
if (!Platform.is.iphone) {
return
}
const wrapper = document.querySelector(element)
const style = top ? [
top: calc(${top} + constant(safe-area-inset-top));,
top: calc(${top} + env(safe-area-inset-top));
].join(’’) : [
‘top: constant(safe-area-inset-top);’,
‘top: env(safe-area-inset-top);’
].join(’’)
if (!wrapper) {
console.error(‘wrapper not found’, element)
return
}
wrapper.setAttribute(‘style’, style)
return wrapper
}
}

Does someone know how to solve this problem?

Quasar info

Operating System - Darwin(18.7.0) - darwin/x64
NodeJs - 12.10.0

Global packages
NPM - 6.11.3
yarn - 1.17.3
@quasar/cli - 1.0.0
cordova - 9.0.0 (cordova-lib@9.0.1)

Important local packages
quasar - 1.1.2 – Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
@quasar/app - 1.1.1 – Quasar Framework local CLI
@quasar/extras - 1.3.1 – Quasar Framework fonts, icons and animations
vue - 2.6.10 – Reactive, component-oriented view layer for modern web interfaces.
vue-router - 3.1.3 – Official router for Vue.js 2
vuex - 3.1.1 – state management for Vue.js
electron - Not installed
electron-packager - Not installed
electron-builder - Not installed
@babel/core - 7.6.0 – Babel compiler core.
webpack - 4.40.2 – Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, … and your custom stuff.
webpack-dev-server - 3.8.1 – Serves a webpack app. Updates the browser on changes.
workbox-webpack-plugin - 4.3.1 – A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.
register-service-worker - 1.6.2 – Script for registering service worker, with hooks

Quasar App Extensions
None installed

Try this

body {
padding-top: constant(safe-area-inset-top); /* iOS 11.0 /
padding-top: env(safe-area-inset-top); / iOS 11.2 */
}

Hello
Check the links but I continue with the detail. The problem is caused by a simple class and I am not using typescript. I will continue investigating, thank you very much @Hawkeye64

I am trying to create an instance of one class that extends from another.

Within the constructor of the daughter class I execute the super () method to execute the constructor of the parent class.

An example:

import StoreService from 'core / services / StoreService'
import Store from 'src / store / base / positions'

class Positions extends StoreService {
   constructor () {
     super (Store, 'basePositions')
   }
}

export default new Positions ()

This class to extend and make use of it is the one that throws me the error:

Class constructor Positions cannot be invoked without ‘new’.

Any suggestions? I think the problem is related to babel but I can’t find an applicable solution to the quasar project.

@rstoenescu I need something more complete. For example:
https://introjs.com/
http://linkedin.github.io/hopscotch

The effect of highlighting an element such as introjs. I’ll try a vue-tour to see if I can adapt it.

Thanks for your attention

Hello, there will be some component that allows you to create a tour type vue-tour,
https://github.com/pulsardev/vue-tour

I know that the components offered by quasar could be created, but is there already some?

@s-molinari Thanks for the support, Quasar is an awesome tool
@Cego I have not used what you say, I think of using npm link

Thanks guys, if I find a way I tell them

Hi @mKomo , thanks for your reply.

I use the routes in the same way you explain to me.
The idea is to separate those routes out of the project. Since my file of routes is immense. That’s why the idea of separating into different projects.

Anyway I appreciate your comments, saludos.