Prerequisites
This tutorial assumes that you have the following:
- Basic knowledge of Node
- Node installed on your machine
- Any code or text editor of your choice
Initially, create Express application with command in terminal.
npx express-generator < your-project-name > --no-view
Here, --no-view flag means that we will not use any template engine such as handlebars, ejs or pug, for our skeleton Express application.
After creating your application, you need to go to your application directory. For Windows Powershell and Linux terminals, use:
cd your-project-name
Then open your desired text editor. For me I only use VSCode so I have my terminal and my text editor open at the same time. But you can use any text editor you want.
Install dependencies with the following command:
npm install
Once we have the generated project ready, we need to install the dependencies and move some folders. Run this command to install other packages.
Here we can use three different kinds or methods to do our job with ease.
First Method:
Type the following in terminal:
npm install esm
and also install nodemon for specific project only as
npm install --save-dev nodemon or npm install -D nodemon
Nodemon automatically restarts your application and allows you to test new changes to your Express app faster, or install as a global NPM dependency
npm install -g nodemon
Enable esm for packages: Use esm to load the main ES module and export it as CommonJS in the main entry file, index.js.
require = require("esm")(module);
module.exports = require("./app.js");
create a new file, app.js and add the following.
const express = require('express');
import express from 'express';
var app = express();
var PORT = 3000;
app.listen(PORT, function(err){
if (err) console.log("Error in server setup")
console.log("Server listening on Port", PORT);
})
run the app with:
npm start
at this stage if you had any problems use the
codesendbox link as a reference.
Second Method:
add the following in project's package.json file.
"type": "module"
and voila, but you need to add extensions with all files, which you want to add as import, like (filename.js), as example:
import userRoutes from './routes/userRoutes.js';
at this stage if you had any problems use the
codesendbox link as a reference.
Third Method:
using Babel setup
What is Babel?
Babel is a JavaScript compiler, that helps you use the ES6 functions of the JavaScript programming language.
add the following packages, we use the command
npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/node babel-plugin-module-resolver rimraf
or
npm install -D @babel/core @babel/cli @babel/preset-env @babel/node babel-plugin-module-resolver rimraf
after installing the packages, add the following in project's package.json file.
"scripts": {
"build": "npm run clean && babel ./src --out-dir dist --copy-files",
"clean": "rimraf dist",
"prod": "npm run -s build",
"start": "node dist/app.js",
"dev": "nodemon --exec babel-node src/app.js"
},
So once you are done with the installation, create a new file called .babelrc to configure babel. Add the following text in it.
{
"presets": ["@babel/preset-env"],
"plugins": [
[
"module-resolver",
{
"alias": {
"@routes": "./src/routes"
}
}
]
]
}
conclusion
We learned how to use ES6 in our Node.js project to write the latest JavaScript functions in the best way.
Feel free to check the code on GitHub Repository if you had any trouble following the last part of this article, when we included Babel as a JavaScript compiler.
If you have any questions or comments about this article, please do not hesitate to reach out.
Thank you for reading.
Credits
Express.js, the minimal and flexible Node.js web application framework: https://expressjs.com/
Esm, Tomorrow's ECMAScript modules today!: https://github.com/standard-things/esm#readme
Nodemon, reload, automatically: https://nodemon.io/
Babel, is a JavaScript compiler: https://babeljs.io/docs/en/usage
Top comments (0)