Vue - ERROR in Aside.vue when run npm run serve

Demo: 8
Version: 8.1.1 with vue

When i run: npm run serve i get this errors:

ERROR in ./src/layout/aside/Aside.vue?vue&type=script&lang=ts (./node_modules/ts-loader/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/layout/aside/Aside.vue?vue&type=script&lang=ts) 2:0-41
Module not found: Error: Package path ./index is not exported from package /home/jiha/WebstormProjects/flas-frontend-new/demo8/node_modules/vue-i18n (see exports field in /home/jiha/WebstormProjects/flas-frontend-new/demo8/node_modules/vue-i18n/package.json)
@ ./src/layout/aside/Aside.vue?vue&type=script&lang=ts 1:0-196 1:0-196 1:197-382 1:197-382
@ ./src/layout/aside/Aside.vue 2:0-56 3:0-51 3:0-51 6:49-55
@ ./node_modules/ts-loader/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/layout/Layout.vue?vue&type=script&lang=ts 4:0-47 25:17-24
@ ./src/layout/Layout.vue?vue&type=script&lang=ts 1:0-191 1:0-191 1:192-372 1:192-372
@ ./src/layout/Layout.vue 2:0-57 3:0-52 3:0-52 6:49-55
@ ./src/router/index.ts 9:40-69
@ ./src/main.ts 6:0-30 19:8-14

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

Hi,

The issue is with vue-i18n imports in some files.

We already fixed this and include a fix in the next Metronic release, you need to change imports from

import { useI18n } from "vue-i18n/index";

to
import { useI18n } from "vue-i18n";

Very well!
The error is gone in components, now when running npm run serve I get the following:

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

webpack compiled with 1 error
No issues found.

Hi,

You need to fix the same import in file /src/core/plugins/i18n.ts.

Solved, thanks!

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

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