Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now
Light
Dark
System
Ask  Question

There's too many errors from VSCode out of the box

There's too many errors coming from all Vue files. Is there any way to fix them? Please help.

Cheers, Mizan

Example:

  • Account.vue

Type '{ href: string; class: string; dataBsToggle: string; "data-bs-toggle": string; dataBsTarget: string; "data-bs-target": string; }' is not assignable to type 'HTMLAttributes<HTMLAnchorElement>'. Property 'dataBsToggle' does not exist on type 'HTMLAttributes<HTMLAnchorElement>'.ts(2322)

  • App.vue const RouterView: new () => { $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & RouterViewProps; $slots: { ...; }; } 'RouterView' cannot be used as a JSX component. Its instance type '{ $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & RouterViewProps; $slots: { ...; }; }' is not a valid JSX element.ts(2786)

  • Settings.vue JSX element class does not support attributes because it does not have a 'props' property.ts(2607) 'Field' cannot be used as a JSX component. Its instance type '{ $: ComponentInternalInstance; $data: {}; $props: Partial<{ label: string; as: string | Record<string, any>; bails: boolean; uncheckedValue: any; validateOnInput: boolean; ... 9 more ...; keepValue: boolean; }> & Omit<...>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...>...' is not a valid JSX element.ts(2786)

M
M Norhamizan 3 years ago
Vue
1 Answers
Text formatting options
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
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (1)

user
Lauris Stepanovs Author 3 years ago

Hi,

I assume that you are using the Volar extension for your VS code.

We have checked Metronic in Visual Studio Code with Volar installed, looks like the errors are related to fullcalendar plugin implementation. We will review this and include a fix in upcoming releases.

For a fix please refer to the following Volar GitHub issue.
https://github.com/johnsoncodehk/volar/discussions/592

To disable a fullcalendar extension please follow steps below.

  1. Remove dependencies listed below from you package.json:


    2. "@fullcalendar/core": "^5.9.0",
    
"@fullcalendar/daygrid": "^5.9.0",
    
"@fullcalendar/interaction": "^5.9.0",
    
"@fullcalendar/list": "^5.9.0",
    
"@fullcalendar/timegrid": "^5.9.0",

  2. Remove these plugin imports from file components/calendar/CalendarApp1.vue.

  3. Then delete package-lock.json/yarn.lock and node_modules.

  4. Install dependencies again with yarn or npm install commands.

  5. Rerun your Visual Studio Code.



Regards,
Lauris Stepanovs,
Keenthemes Support Team
Text formatting options
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
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
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
  • happy  :)
  • shocked  :|
  • sad  :(