File Path Import in JS

We are going to learn to set the path of the files to import in a current file using the two syntaxes below:

1.   ./            [Within the same folder]
2.  ../            [To upward the folder]

1) ./[Folder]/[Folder]/File: This is used when both files are in the same folder.

• Example 1:

Here App.js and index.js are in the same location. So just use (./) to import.

• Example 2:

Here App.js and components folder are in the same location. Therefore, (./) has been used here. And after (./), it provides the up to path of the PropsComponent1.js file.

2) ../[Folder]/[Folder]/File: This is used when required to upward from the current folder.

Here current file is PropsComponent2.js. In this file has been imported App.js. Both are not in the same folder. So, Need to upward from PropsComponent2.js to Props folder using (../) and then the Props folder to the components folder using another (../). Therefore, final path is (../../App).