V8.1.2 | Vue + Laravel integration not compiling

Errors w

ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\TableContent.vue.ts
55:13-73
[tsl] ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\TableContent.vue.ts(55,14)
TS2802: Type 'Set' can only be iterated through when using the '--downlevelIteration' flag or with a '--target' of 'es2015' or higher.

ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\table-body\TableBodyRow.vue.ts
24:15-65
[tsl] ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\table-body\TableBodyRow.vue.ts(24,16)
TS2802: Type 'Set' can only be iterated through when using the '--downlevelIteration' flag or with a '--target' of 'es2015' or higher.

webpack compiled with 2 errors

× Mix
Compiled with some errors in 13.54s

ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\TableContent.vue.ts
55:13-73
[tsl] ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\TableContent.vue.ts(55,14)
TS2802: Type 'Set' can only be iterated through when using the '--downlevelIteration' flag or with a '--target' of 'es2015' or higher.

ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\table-body\TableBodyRow.vue.ts
24:15-65
[tsl] ERROR in c:\wamp64\www\privateUser\newMetronics\resources\ts\src\components\kt-datatable\table-partials\table-content\table-body\TableBodyRow.vue.ts(24,16)
TS2802: Type 'Set' can only be iterated through when using the '--downlevelIteration' flag or with a '--target' of 'es2015' or higher.

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (7)

Hi,

We have an issue with our doc, we will check this problem and fix it in upcoming releases.

For now, you can consider using a different approach from the tutorial below.
https://vegibit.com/how-to-use-vuejs-with-laravel-blade/

Regards,
Lauris Stepanovs,
Keenthemes Support Team

Hi,

This is not a document issue. It is code related. I commented out the code for the table templates for the code to build.

Hi,

Could you please clarify which exactly lines you commented out?

New Laravel 9 uses a vite.js to compile assets, we are working now on a doc update for Laravel 9.

Regards,
Lauris Stepanovs,
Keenthemes Support Team

Hi,

I am using Laravel 8. I commented out all lines in TableBodyRow.vue and TableContent.vue.

With that in mind, I have to build my own table.

Hi,

It seems like the issue is related to your typescript configuration files, can you please attach your tsconfig.json?

Regards,
Lauris Stepanovs,
Keenthemes Support Team

{
"compilerOptions": {
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"noImplicitAny": false,
"target": "es5",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"paths": {
"@/*": [
"resources/ts/src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"resources/ts/src/**/*.ts",
"resources/ts/src/**/*.tsx",
"resources/ts/src/**/*.vue"
],
"exclude": [
"node_modules"
]
}

Hi,

Can you try to add property "downlevelIteration": true, to your tsconfig.json?

Regards,
Lauris Stepanovs,
Keenthemes Support Team

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(