Hello folks! welcome back to a new section of our tutorial on Next.js. In this tutorial, we will be studying about Next.js CLI.
Next.js makes available a CLI to start, build and export application. It can be called with npx which comes with npm 5.2 and above.
Next.js makes available a CLI to start, build and export application. It can be called with npx which comes with npm 5.2 and above.
CLI Help
To get a list of CLI commands and help on them, type the following command -
npx next -h Usage $ next <command> Available commands build, start, export, dev, telemetry Options --version, -v Version number --help, -h Displays this message For more information run a command with the --help flag $ next build --help
Build Production Ready Build
Try the following command -
npx next build info - Loaded env from D:\Node\nextjs\.env.local Creating an optimized production build Compiled successfully. Automatically optimizing pages Page Size First Load JS + ? / 2.25 kB 60.3 kB + /_app 288 B 58.1 kB + /404 3.25 kB 61.3 kB + ? /api/user + ? /posts/[id] 312 B 61.6 kB + + /posts/one + + /posts/two + ? /posts/env 2.71 kB 60.8 kB + ? /posts/first 374 B 61.7 kB + First Load JS shared by all 58.1 kB + static/pages/_app.js 288 B + chunks/ab55cb957ceed242a750c37a082143fb9d2f0cdf.a1a019.js 10.5 kB + chunks/framework.c6faae.js 40 kB + runtime/main.60464f.js 6.54 kB + runtime/webpack.c21266.js 746 B + css/9706b5b8ed8e82c0fba0.css 175 B ? (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps) (Static) automatically rendered as static HTML (uses no initial props) ? (SSG) automatically generated as static HTML + JSON (uses getStaticProps)
READ: Next.js | Deployment
Build and Start Development Server
Try the following command -
npx next dev ready - started server on http://localhost:3000 info - Loaded env from D:\Node\nextjs\.env.local event - compiled successfully
Start the Production Server
Try the following command -
npx next start info - Loaded env from \Node\nextjs\.env.local ready - started server on http://localhost:3000
Alright guys! This is where we are going to be rounding up for this tutorial. In our next tutorial, we are going to be starting a series on AngularJS.
Feel free to ask your questions where necessary and we will attend to them as soon as possible. If this tutorial was helpful to you, you can use the share button to share this tutorial.
Follow us on our various social media platforms to stay updated with our latest tutorials. You can also subscribe to our newsletter in order to get our tutorials delivered directly to your emails.
Thanks for reading and bye for now.
Feel free to ask your questions where necessary and we will attend to them as soon as possible. If this tutorial was helpful to you, you can use the share button to share this tutorial.
Follow us on our various social media platforms to stay updated with our latest tutorials. You can also subscribe to our newsletter in order to get our tutorials delivered directly to your emails.
Thanks for reading and bye for now.