Demo 4 Vue JS Error

Throwing this error when executing "npm run serve"

Already implemented
import { useI18n } from "vue-i18n";

Module not found: Error: Package path ./index is not exported from package D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n (see exports field in D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n\package.json)

ERROR in ./src/core/plugins/i18n.ts 1:0-44
Module not found: Error: Package path ./index is not exported from package D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n (see exports field in D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n\package.json)
@ ./src/main.ts 9:0-39 25:8-12

webpack compiled with 1 error
ERROR in src/components/widgets/charts/Widget1.vue:135:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
133 | horizontal: false,
134 | columnWidth: "30%",
> 135 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
136 | },
137 | },
138 | legend: {

ERROR in src/components/widgets/charts/Widget2.vue:133:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
131 | horizontal: false,
132 | columnWidth: "30%",
> 133 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
134 | },
135 | },
136 | legend: {

ERROR in src/components/widgets/charts/Widget5.vue:133:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
131 | horizontal: false,
132 | columnWidth: "12%",
> 133 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
134 | },
135 | },
136 | legend: {

ERROR in src/components/widgets/charts/Widget6.vue:136:9
TS2322: Type '{ horizontal: false; endingShape: string; columnWidth: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
134 | bar: {
135 | horizontal: false,
> 136 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
137 | columnWidth: "12%",
138 | },
139 | },

ERROR in src/components/widgets/mixed/Widget10.vue:116:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
114 | horizontal: false,
115 | columnWidth: "50%",
> 116 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
117 | },
118 | },
119 | legend: {

WAIT Compiling... 4:32:50 pm

Compiling...

ERROR Failed to compile with 1 error 4:33:24 pm

error in ./src/core/plugins/i18n.ts

Module not found: Error: Package path ./index is not exported from package D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n (see exports field in D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n\package.json)

ERROR in ./src/core/plugins/i18n.ts 1:0-44
Module not found: Error: Package path ./index is not exported from package D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n (see exports field in D:\Development\Quote-Tool\Test\demo4\node_modules\vue-i18n\package.json)
@ ./src/main.ts 9:0-39 25:8-12

webpack compiled with 1 error
ERROR in src/components/widgets/charts/Widget1.vue:135:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
133 | horizontal: false,
134 | columnWidth: "30%",
> 135 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
136 | },
137 | },
138 | legend: {

ERROR in src/components/widgets/charts/Widget2.vue:133:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
131 | horizontal: false,
132 | columnWidth: "30%",
> 133 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
134 | },
135 | },
136 | legend: {

ERROR in src/components/widgets/charts/Widget5.vue:133:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
131 | horizontal: false,
132 | columnWidth: "12%",
> 133 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
134 | },
135 | },
136 | legend: {

ERROR in src/components/widgets/charts/Widget6.vue:136:9
TS2322: Type '{ horizontal: false; endingShape: string; columnWidth: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
134 | bar: {
135 | horizontal: false,
> 136 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
137 | columnWidth: "12%",
138 | },
139 | },

ERROR in src/components/widgets/mixed/Widget10.vue:116:9
TS2322: Type '{ horizontal: false; columnWidth: string; endingShape: string; }' is not assignable to type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean |
undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
Object literal may only specify known properties, and 'endingShape' does not exist in type '{ horizontal?: boolean | undefined; columnWidth?: string | undefined; barHeight?: string | undefined; distributed?: boolean | undefined; borderRadius?: number | number[] | undefined; rangeBarOverlap?: boolean | undefined; rangeBarGroupRows?: boolean | undefined; colors?: { ...; } | undefined; dataLabels?: { ...; } |...'.
114 | horizontal: false,
115 | columnWidth: "50%",
> 116 | endingShape: "rounded",
| ^^^^^^^^^^^^^^^^^^^^^^
117 | },
118 | },
119 | legend: {

Mikenify Balite 3 years ago

Vue

3 Answers

Text formatting options

Private reply Submit

Click any option to insert into your comment. Select text first to wrap it.

**text** to make things bold
*text* to emphasize
### Heading to make headings
[link text](url) for links
![alt text](image-url) to paste in an image
- item to make a list
1. item to make an ordered list
> quote to quote somebody
`code` for single line of code
```js ... ``` for JS code block
```html ... ``` for HTML code block
```scss ... ``` for SCSS code block
```php ... ``` for PHP code block
--- for a horizontal rule
:)
:|
:(

Replies (3)

Lauris Stepanovs Author 3 years ago

Hi Mikenify,

From your error it seems that in some widgets there are wrong properties in the chart configuration, it must be fixed in the latest Metronic version.

Can you try to remove these properties which throws error?

Mikenify Balite 3 years ago

Thank you the error is fixed now

Lauris Stepanovs Author 3 years ago

Glad to hear that. All the best with your project!

Your Support Matters!

We will highly appreciate your Metronic Review on Themeforest.

Please go to Themeforest Downloads page, select Metronic & leave your feedback.

Metronic

Go to Metronic Downloads License Guide & FAQ Purchase Metronic Refunds

Demo 4 Vue JS Error

Replies (3)

Your Support Matters!

Metronic

Products

Legal

Stay Connected