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

Building assets for ASP.NET Core


Hi,

I bought Metronic theme v8.1.5. I installed Node.js v18.12.0 LTS and Yarn 1.22.19. NET SDK 6.0.9 already installed.

I tried to build assets for Starterkit ASP.NET Core demo1 several times without success.
Installing dependecies with
- "npm install" return bunch of errors and does nothing,
- "yarn install" creates some folders with files.
Either one does not create folder node_modules inside _keenthemes/tools as it is described in documentation.

Next step: "gulp" says
Local modules not found in e:\Starterkit\_keenthemes\tools
Try running: yarn install

I tried "npm run build" and it says
CLI for webpack must be installed. webpack-cli (https://github.com/webpack/webpack-cli)

If I confirm installation of webpack-cli, it runs some commands with warnings and at the end end it says
Error: Cannot find module 'webpack-cli/package.json'

What am I doing wrong? Please help.


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


Hi Valentin,

We rechecked the latest version of Metronic and theme assets build commands should be working fine. From your description seems like you are doing everything correctly, do you execute installation commands from Starterkit/_keenthemes/tools folder?

You can navigate this folder with the command below:

cd Starterkit/_keenthemes/tools


If you are already in the right folder then, could you please attach an error that you receive on npm install?

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi,
Bellow is attached an error received on npm install. Also i noticed that in Step 2 folder _keenthemes/tools/node_modules is not created when I run yarn install.

d:\metronic_v8.1.5\asp.net-core\asp.net-core_demo1\Starterkit\_keenthemes\tools>npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: keenthemes@1.0.0
npm ERR! Found: @popperjs/core@2.11.5
npm ERR! node_modules/@popperjs/core
npm ERR! @popperjs/core@"2.11.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @popperjs/core@"^2.11.6" from bootstrap@5.2.2
npm ERR! node_modules/bootstrap
npm ERR! bootstrap@"5.2.2" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\valentin\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\valentin\AppData\Local\npm-cache\_logs\2022-11-07T09_27_19_961Z-debug-0.log

Regards, Valentin



Hi Valentin,

Could you please try to run installation commands with --force or --legacy-peer-deps flags?


npm install --legacy-peer-deps


## or

npm install --force


Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi,
Running npm install with --legacy-peer-deps worked ok.
After that npm run build executed seccessfully with some warnings - copy below.
I reviewed the code and noticed not all the views are built. Is that intentionally? When I run the app, only dashboard page is accessible, when I try to view others, they redirect to dashboard page.

d:\metronic_v8.1.5\asp.net-core\asp.net-core_demo1\Starterkit\_keenthemes\tools>npm run build

> keenthemes@1.0.0 build
> webpack

>> Building metronic bundle...
Deprecation Warning: $weight: Passing a number without unit % (100) is deprecated.

To preserve current behavior: $weight * 1%

More info: https://sass-lang.com/d/function-units

â•·
201 │ @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
node_modules\bootstrap\scss\_functions.scss 201:11 opaque()
node_modules\bootstrap\scss\mixins\_table-variants.scss 4:28 table-variant()
node_modules\bootstrap\scss\_tables.scss 147:3 @import
..\src\sass\components\components.scss 12:9 @import
..\src\sass\style.scss 9:9 root stylesheet

>> Completed metronic bundle in 14.657s!
webpack compiled successfully



Hi Valentin,

Glad to hear that --legacy-peer-deps worked for you.

Our Asp.Net-Core version is a Starterkit, which contains a fully functional layout and a few pages for start (New Password, Reset Password, Sign In, Sign Up, Default Dashboard Page, 500 error page, and 404 error page).

We will be adding more pages in the next releases, we have plans for User Management App, System Settings page, and Audit Log page implementation.

You can easily add any other pages by referring to our HTML version, all JS, and CSS code required for any page is already included in our Asp.Net-Core Starterkit, all you need to do is just copy HTML markup and include JS file on your page view (if it is required). Let me know if you will need any further help on this.

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi,

Ok, thank you for all help for now.

Kind regards.
Valentin


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