Hello !
I want to add lib “vue-echarts-v3” to Quasar CLI project.What i have done :
- Installed “vue-echarts-v3” as “npm install --save echarts vue-echarts-v3”
- Edited “quasar.conf.js” as added "build: {
scopeHoisting: true,
extendWebpack (cfg) {
})
cfg.module.rules.push({
test: /.js$/,
loader: ‘babel-loader’,
include: [resolve(‘src’), resolve(‘test’), resolve(‘node_modules/vue-echarts-v3/src’)]
})
}
},
" - In vue module i added :
“<script>
import { QCard, QCardSection } from ‘quasar’
import IEcharts from ‘vue-echarts-v3’
…”
"
<template>
<q-page class=“flex flex-center”>
<img alt=“Quasar logo” src="~assets/quasar-logo-full.svg">
<div name=“divchart” class=“echarts”>
<i-echarts
:option=“bar”
:loading=“loading”
@ready=“onReady”
@click=“onClick”
/>
…
"When load the app in browser i look in Console and there have message
"
vue.runtime.esm.js?2b0e:619 [Vue warn]: Unknown custom element: <i-echarts> - did you register the component correctly? For recursive components, make sure to provide the “name” option.found in
—> <PageIndex> at src/pages/Index.vue
<QPageContainer>
<QLayout>
<MyLayout> at src/layouts/MyLayout.vue
<App> at src/App.vue
<Root>
"I’m new in Vue, and i cant understood why IECharts are not visible/reachable.
Can somebody help me, please !
-
Resolved - а spelling error for “componets” instead of “components”
- ABOUT A YEAR LATER
@minko Can you post your quasar.config.js ?
I am getting error
ReferenceError: resolve is not definedAfter adding
cfg.module.rules.push({ test: /.js$/, loader: 'babel-loader', include: [resolve('src'), resolve('test'), resolve('node_modules/vue-echarts-v3/src')] }) -
Ok, I looked at https://github.com/pratik227/echarts-quasar and didn’t have to add anything in quasar.conf.js
It just works.