2 Step 1: Install Typescript globally on your machine.
3 Step 2: Create a project folder.
4 Step 3: Configure tsconfig.json.
5 Step 4: Install webpack and ts dependencies.
6 Step 5: Create webpack configuration file.
7 Step 6: Run the webpack development server.
First, we need to install the typescript.
Step 1: Install Typescript globally on your machine.
Switch to your terminal and hit the following command to install typescript globally on your machine.
Step 2: Create a project folder.
Create a new project folder and go into that project.
Okay, now in the root folder, make one typescript file called index.ts and inside that file, we will write some typescript code.
In the root folder, make one file called tsconfig.json file.
Step 4: Install webpack and ts dependencies.
We need to install the webpack and other as development dependencies.
Now we need to install locally TypeScript compiler and the TypeScript loader.
Also, generate a package.json file by typing the following command.
Step 5: Create webpack configuration file.
Inside root folder, create one file called webpack.config.js.
In this file, we have defined the entry point file as an app.ts. So let us create that file first.
Okay when we run webpack-dev-server, it output the file named app.js. So app.js is the file we need to include the index.html file. We have not created the index.html file so, let us do it first.
Step 6: Run the webpack development server.
Go to the package.json file and add the following script.
Now, go to the terminal and start the server.
So that is it for the How to setup typescript with webpack 4 tutorial.
Hello . Thank you for your tutorial .
Q : Why i can't find app.js in my directory ?