New metronic v9 update problem
Hello,
Following the update of Metronic v9, here is the error I get:
22:57:22 [vite] Pre-transform error: Failed to load url /src/main.ts (resolved id: /src/main.ts). Does the file exist? (x3)
Can you please help me?
Replies (12)
Hi,
If you haven't managed to get a working application by following our integration guide, refer to the Metronic Tailwind React project in our guides repo.
Since it is a public repo, it doesn't contain theme assets. Follow the steps below before running the application:
- Open the repo at https://github.com/KeenthemesHub/metronic-tailwind-html-integration.
- Download the
metronic-tailwind-reactfolder. - Copy the
srcfolder from themetronic-tailwind-htmlpackage and paste it into themetronic-tailwind-react/srcdirectory. - Rename the copied folder to
theme. The directory structure should now look like this:metronic-tailwind-react/src/theme. - Copy the media folder from
metronic-tailwind-html/dist/assetsand paste it intometronic-tailwind-react/public. - Install dependencies with
npm installand serve the project withnpm run dev.
Please let us know if you need any help on this topic or anything else.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
Hi,
I already followed those steps...
Hey there, I'm the developer which asked this thread's question.
I've tried cloning your repository and installing metronic 9 by following the given commands on this thread.
I've got now a new error.
uncaught SyntaxError: The requested module "http://localhost:5173/src/theme/app/layouts/demo1.js" doesn"t provide an export named: "default"There are also several vite warnings about the style, I'll leave a paste here.
https://pastebin.com/gNf6pKFh
HI,
To fix this error in file src/theme/app/layouts/demo1.js you should change
KTDom.ready(() => {
KTLayout.init();
});to
export default KTLayout;Regards,
Lauris Stepanovs,
Keenthemes Support Team
Hi there.
I encountered in the boilerplate that you gave me once again an error by following the edit that you suggested me. The error is now:
Uncaught ReferenceError: can"t access lexical declaration "KTSticky" before initializationHi, the same for me !
Hi,
Do you import KTComponents from theme/core/index?
The correct file you should use is core/index.spa.ts which doesn't contain KTDom.ready code part causing this error.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
import Sidebar from "./components/Sidebar.js";
import Footer from "./components/Footer.js";
import Header from "./components/Header.js";
import KTComponent from "./theme/core/index.spa.ts";
import { useEffect } from "react";
import KTLayout from "./theme/app/layouts/demo1.js";
function App() {
useEffect(() => {
KTComponent.init();
KTLayout.init();
}, []);
return (
<>
<div className="flex grow">
<Sidebar />
<div className="wrapper flex grow flex-col">
<Header />
<main className="grow content pt-5" role="content">
<div className="container-fixed" >
</div>
<div className="container-fixed">
{/* place your content here */}
</div>
</main>
<Footer />
</div>
</div>
</>
)
}
export default AppThis is my file which is causing the issue above, KTComponent is imported from core/index.spa.ts
I don't understand why it doesn't work for many people and it works for you???
Hi,
I pushed the update to the examples repo. Can you try the updated example?
It seems like index.ts and index.spa.ts conflicts, to fix the problem after you copied assets delete src/theme/core/index.ts and rename src/theme/core/index.spa.ts to index.ts.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
Hi
May I know which application are you trying to integrate with Metronic?
Thanks
Vite+react
