Thanks for pointing this out. I agree that Vite is still not 100% replacement for CRA, but is better in all aspects. Plus the official documentation now mentions frameworks like Next.JS as the starting point
Java Professional with full-stack competence; Consultant; Contractor; Speaker; Co-founder of jPrime Conference; Founder of jProfessional conferences; Founder of java.beer events;
Not really sure, but I think since Vite just creates a standard project structure using npm. However, you can still use npx to create project structures based on templates. Look up community templates
So in NPM there will be a package named create-vite and this is what gets executed.
Similarly, the command for scaffolding a new Next.js app in the Next.js quickstart is npx create-next-app@latest. This can instead be run as: npm create next-app@latest (I suppose @latest can be omitted).
By the way npm create is just a synonym for npm init that we routine use to scaffold a blank Node app. So by saying npm create vite we are just passing the name of package create-vite to npm init to use as the scaffolder instead of the default scaffolding logic.
Full Stack (MERN)/ React-Native developer. I want to help other developers avoid some of the same challenges I faced while developing various features.
My team and I Ran into quite a few issues with authorization sessions/cookies in vite. Tried again in create-react-app and had no issues with it whatsoever. Not sure how I feel about either but I'm not commited to one or the other
Vite is only good for learning IMO. The last time I checked, it didn't generate a proper production bundle.
A framework like Next.js on the other hand is entirely about production bells and whistles. So next.js has put tons of work in production webpack config (with code splitting, image optimisation, polyfilling etc all configured for you) which you can customise also and which they keep updated. They also have a really simple CI/CD experience and terrific support for SSR and SSG and for SEO.
In fact even for learning, next.js would be an excellent tool. The scaffold it generates is so simple and minimal that you can scaffold a new app to quickly try something out in React or to follow along with a YouTube tutorial. I think somebody who has build a couple of pages with React by linking the two react scripts directly in script tags and understands the basics of how JSX gets translated into HTML, should be able to follow next.js's excellent Getting Started tutorial.
Given how some it is to get started with Next.js, the only advantage I see with Vite is that it has a faster Dev server. But Next.js Dev server experience isn't slow either. So Vite's Dev server being faster is a moot point IMO.
The decision to encourage developers new to React to start with a meta-framework like Next.js is...interesting. While I understand that CRA is usually not a good choice for a production app, it is a great choice for learning, as you're only working with React. This takes context issues to a whole new level.
Before, a new dev could confuse a JS issue with a React issue, due to not fully understanding whether they're writing "React code" or "JavaScript code" ATM. But now, new devs will have to try and determine whether they're writing "Next.js code", "React code", or "JavaScript code". And if there's an issue, how could we possibly expect them to file an issue with the right team?
It will be interesting to see where this decision leads...
👋Pierre-Henry. A Passionate AI Software Engineer😎 I create cool stuff (https://github.com/Lifyzer & https://github.com/pH7Software), love problem-solving, eating veggies, and developing new skills😊
Vite has high chance of not working in production with React github.com/vitejs/vite/issues/2139
Thanks for pointing this out. I agree that Vite is still not 100% replacement for CRA, but is better in all aspects. Plus the official documentation now mentions frameworks like Next.JS as the starting point
woow,,,that is a serious bug
Why it uses NPM and not NPX ?
npm is only for packages not for project creations, npx is for executions.
P.S. Not a JavaScript developer here really I am asking since this was my understanding.
Not really sure, but I think since Vite just creates a standard project structure using npm. However, you can still use npx to create project structures based on templates. Look up community templates
It does use npx behind the scenes I think.
So npm create xxx actually runs:
npx create-xxxSo in NPM there will be a package named create-vite and this is what gets executed.
Similarly, the command for scaffolding a new Next.js app in the Next.js quickstart is
npx create-next-app@latest. This can instead be run as:npm create next-app@latest(I suppose@latestcan be omitted).By the way
npm createis just a synonym fornpm initthat we routine use to scaffold a blank Node app. So by sayingnpm create vitewe are just passing the name of packagecreate-vitetonpm initto use as the scaffolder instead of the default scaffolding logic.Thank you alot
My team and I Ran into quite a few issues with authorization sessions/cookies in vite. Tried again in create-react-app and had no issues with it whatsoever. Not sure how I feel about either but I'm not commited to one or the other
Vite is only good for learning IMO. The last time I checked, it didn't generate a proper production bundle.
A framework like Next.js on the other hand is entirely about production bells and whistles. So next.js has put tons of work in production webpack config (with code splitting, image optimisation, polyfilling etc all configured for you) which you can customise also and which they keep updated. They also have a really simple CI/CD experience and terrific support for SSR and SSG and for SEO.
In fact even for learning, next.js would be an excellent tool. The scaffold it generates is so simple and minimal that you can scaffold a new app to quickly try something out in React or to follow along with a YouTube tutorial. I think somebody who has build a couple of pages with React by linking the two react scripts directly in script tags and understands the basics of how JSX gets translated into HTML, should be able to follow next.js's excellent Getting Started tutorial.
Given how some it is to get started with Next.js, the only advantage I see with Vite is that it has a faster Dev server. But Next.js Dev server experience isn't slow either. So Vite's Dev server being faster is a moot point IMO.
Though I never knew you at all
You had the grace to hold yourself
While those around you crawled
The decision to encourage developers new to React to start with a meta-framework like Next.js is...interesting. While I understand that CRA is usually not a good choice for a production app, it is a great choice for learning, as you're only working with React. This takes context issues to a whole new level.
Before, a new dev could confuse a JS issue with a React issue, due to not fully understanding whether they're writing "React code" or "JavaScript code" ATM. But now, new devs will have to try and determine whether they're writing "Next.js code", "React code", or "JavaScript code". And if there's an issue, how could we possibly expect them to file an issue with the right team?
It will be interesting to see where this decision leads...
Nice read Abhigyan! Personally, I'm a big fan of Vite. This is great news TBH.