W
Wasp-lang2mo ago
ayo

No MainPage.tsx

I recently began walking through the docs starting with the quick start guide. I have since gotten the the app to start, moving on to https://wasp-lang.dev/docs/tutorial/project-structure where I see a reference to src/MainPage.tsx . I do not have this file in my template app. was version 0.14.2 platform: macOs
5 Replies
kapa.ai
kapa.ai2mo ago
Hi @ayo. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- It seems there might be a discrepancy between the documentation you're reading and the actual project structure you're seeing. Let me explain why this might be happening and provide some clarification. The documentation you're referring to at Project Structure (https://wasp-lang.dev/docs/tutorial/project-structure) shows an example project structure that includes src/MainPage.jsx or src/MainPage.tsx. However, it's important to note that Wasp has undergone some changes in its project structure over time. In more recent versions of Wasp (which includes your version 0.14.2), the project structure has been simplified. According to the migration guide from version 0.11 to 0.12 Migration Guide (https://wasp-lang.dev/docs/migrate-from-0-11-to-0-12#new-project-structure), the new project structure no longer requires separate client and server directories. Instead, you can organize your code however you want within the src directory. The current structure for a new Wasp project (as of version 0.12 and later) should look something like this:
.
├── .gitignore
├── main.wasp
├── package.json
├── public
│ └── .gitkeep
├── src
│ ├── Main.css
│ ├── MainPage.jsx
│ ├── queries.ts
│ ├── vite-env.d.ts
│ ├── .waspignore
│ └── waspLogo.png
├── tsconfig.json
├── vite.config.ts
└── .wasproot
.
├── .gitignore
├── main.wasp
├── package.json
├── public
│ └── .gitkeep
├── src
│ ├── Main.css
│ ├── MainPage.jsx
│ ├── queries.ts
│ ├── vite-env.d.ts
│ ├── .waspignore
│ └── waspLogo.png
├── tsconfig.json
├── vite.config.ts
└── .wasproot
Note that in this structure, the main page component is named MainPage.jsx. If you're using TypeScript, it might be MainPage.tsx instead. If you don't see this file in your project, it's possible that: 1. The quick start guide you followed might have a different starting point or file naming convention. 2. There might be a small discrepancy between the documentation and the latest version of Wasp. To resolve this, you can: 1. Check your main.wasp file to see what component is being imported for the main page. 2. If necessary, create a MainPage.jsx or MainPage.tsx file in your src directory and define your main page component there. If you continue to face issues or if the structure of your project significantly differs from what I've described, it might be helpful to consult the Wasp documentation (https://wasp-lang.dev/docs) for the most up-to-date information or reach out to the Wasp community for support. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @ayo, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
miho
miho2mo ago
The default project uses JavaScript. To use TypeScript, you must manually rename the file src/MainPage.jsx to src/MainPage.tsx. Restart wasp start after you do this.
Did you see this bit? 🙂
ayo
ayoOP2mo ago
Yes I do see it. I just do not have a MainPage.*
Thank you for responding 🙂
ayo
ayoOP2mo ago
I should clear up that I used the opeesaas template to begin with https://docs.opensaas.sh/
OpenSaaS.sh
Introduction
Open SaaS is a free, open-source, full-stack SaaS starter kit for React + NodeJS.
martinsos
martinsos2mo ago
Ah well then tutorial won't make much sense, that is tutorial for a Wasp app that you create with wasp new, not open saas, open saas is more complex!
Want results from more Discord servers?
Add your server