search

Daan645 / choices-choices-the-tech-stack

Kies een andere tech-stack voor het ontwerpen en bouwen van een website voor een opdrachtgever
MIT License
0 stars 0 forks source link

Basis installatie maken Remix framework #2

Closed Daan645 closed 3 days ago

Daan645 commented 3 days ago

Ik wil Het remix framework installeren in mijn project.

Daan645 commented 3 days ago

Geen js kunnen installeren

In de documentatie van remix stond dat je tijdens de installatie javascript kon installeren, deze optie kreeg ik niet. Na zoeken op internet kwam ik uit bij github forum waar iemand hetzelfde probleem had als ik. Hierdoor kwam ik erachter dat Remix dit niet meer ondersteund sinds een nieuwe update.

Bronnen

https://github.com/remix-run/remix/discussions/8545

Daan645 commented 3 days ago

Ombouwen naar js

Ik heb gegoogled en vond uiteindelijk dat je de typescript kunt compilen naar js, ik heb dit vervolgens aan chat gpt gebraagd omdat ik hier geen duidelijke informatie voor kon vinden en het te ingewikkeld werk uitgelegd.

  1. De tsconfig.json aanpassen js { "compilerOptions": { "target": "ESNext", // of een andere versie die je wilt "module": "ESNext", "strict": true, "allowJs": true, // Hiermee wordt toegestaan dat je JS-bestanden samen met TS-bestanden kunt gebruiken "skipLibCheck": true, "forceConsistentCasingInFileNames": true, "outDir": "./dist", // De map waar je gecompileerde JS-bestanden naartoe gaan "rootDir": "./app", // De map waar je TS-bestanden zich bevinden "moduleResolution": "node", "esModuleInterop": true, "resolveJsonModule": true, "baseUrl": ".", "paths": { "~/*": ["./app/*"] } }, "include": ["app/**/*.ts", "app/**/*.tsx"], // Of waar je TypeScript-bestanden zich bevinden "exclude": ["node_modules", "dist"] // Exclusies } Als ik nu npx tsc doe worden de bestanden naar js gecompilleerd.

  2. Vite.ts vite.ts moest ik naar vite.js veranderen

side note

Dit was uiteindelijk iets anders dan ik dacht compilen liet de server runnen via typescript en zet dan vervolgens alles wat gerenderd wordt om in javascript wat niet optimaal is voor peformance uiteindelijk was dit niet nodig.

Daan645 commented 3 days ago

Tailwind verwijderen

  1. verwijder tailwind uit dependencies npm uninstall tailwindcss postcss autoprefixer

  2. verwijder de configuratie bestanden rm tailwind.config.js postcss.config.js

  3. verwijder de tailwind imports uit het css bestand

side note

Uiteindelijk was dit niet nodig omdat ik een manier heb gevonden om alsnog de js installatie te krijgen maar we hebben er weer van geleerd :)

Daan645 commented 3 days ago

Oplossing javascript installatie

Het viel mij op dat ik in mijn eerste oplossing zowel dezelfde files in js als ts had. Ik ging wat meer googelen en ik kwam erachter dat compilen iets heel anders is dan het project volledig overzetten naar js. Toen ik de github discussions nog een keer bekeek die ik eerder had gevonden zag ik dat iemand als fix een template had, ik had deze lijn code voor de installatie gekopieerd maar dit deed niets. Ik ben daarna verder op internet gaan zoeken en kwam uit op dit stukje documentatie van remix.

Hierdoor heb ik geleerd dat er templates zijn, en heb ik een javascript template gevonden. Ik moest deze gebruiken aangezien typescript de optie heeft verwijderd om tijdens de installatie javascript te installeren, dit is hoe ik het deed:

npx create-remix@latest --template remix-run/remix/templates/remix-javascript

Uiteindelijk was het dus best makkelijk en heb ik allemaal ingewikkelde, halve oplossingen gevonden maar heb hier wel van geleerd.

Bronnen

https://github.com/remix-run/remix/discussions/8545 https://remix.run/docs/en/main/guides/template