Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $9
Get for 99$

npm run build is failing for nextjs starter kit : metronic-tailwind-next


Hi, i have purchased the metronic yesterday, and integrating it with the nextjs using the starter template : metronic-tailwind-next from github.

Although it works fine when running it using npm run dev. but when i try to run the npm run build then its producing following error:



$ npm run build

> metronic-tailwind-next@0.1.0 build
> next build

â–² Next.js 14.2.4

Linting and checking validity of types ...Failed to compile.

./src/metronic/app/datatables/allowed-ip-addresses.ts:50:4
Type error: Type '(item: string, data: IPAddressData, context: KTDataTableInterface) => string' is not assignable to type '(item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string'.
Types of parameters 'item' and 'item' are incompatible.
Type 'string | number | boolean | object' is not assignable to type 'string'.
Type 'number' is not assignable to type 'string'.

48 | columns: {
49 | select: {
> 50 | render: (
| ^
51 | item: string,
52 | data: IPAddressData,
53 | context: KTDataTableInterface



My project structure looks like this:

metronic-tailwind-next
- public
---- fonts
---- media

src
- components
- metronic
---- app
---- core
---- css
---- vendors
- pages
---- _app.tsx
---- _document.tsx
---- index.tsx


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 (3)


Hi,

There is some issue with the demo datatable file /src/app/datatables/allowed-ip-addresses.ts.

Please try to change at line 51 from this

item: string

to this

item: keyof KTDataTableDataInterface


Regards,
Lauris Stepanovs,
Keenthemes Support Team



The errors do not stop here, other files also have typing errors. What if you can run npm run build on your side to see the complete picture.



Hi,

Sorry for the late reply.

We rechecked the NextJs version example and found a few errors appearing when building the application we already pushed an update with the fix for the Metronic Tailwind NextJs example app.

You can find the latest app in our Github repo, please use the assets from the latest Metronic v9.0.4 version.

Let me know if you have any additional questions on this topic or anything else.

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  :(