Many people will be going through the process of converting their Javascript projects to TypeScript. This can range from being a straightforward task to an arduous one, depending on the complexity and size of the project.
If you are taking on the challenge of converting a bigger project over to TypeScript, you might want to be able to keep track of your progress.
I am part of a team that is converting JavaScript files to TypeScript when we can, and I recently had a session where I converted a large directory of files.
I wanted to chart my team's progress in converting these files so we could see we were making progress, and how much further we needed to go.
Getting started
As with most programming tasks, there are other ways to do this. However, I wanted a simple script that remained a part of the repository I was working on to keep things close and make it as simple as possible for other developers to run.
So to start, I created a simple file called calculateConversion.js and modified the scripts section of my package.json file. This tells the script to run the file in with node.
Yes, I know it's slightly ironic to be converting everything to TypeScript and creating this in JavaScript. Still, I didn't want to add any more preprocessing or packages than were necessary and this file will be deleted once everything is converted anyway.
Installing Glob
We will be using the Glob package to quickly search through all the files in the repository.
At the time of writing, I am using version 11.0.0.
Once that is installed, we need to add it to our empty calculateConversion.js file.
Searching for files
We will then create a function that takes in a file pattern and uses Glob to retrieve a list of those files.
As you can see, we are using the pattern passed into the function to pass onto the Glob request. You will also see that we are making use of a second parameter which allows us to filter out files that we do not want included as part of the search. For example, I don't want any compiled, node_modules, test coverage, or any other automatically processed files to be included as part of the search. The main reason is that it'll probably include duplicate code, and TypeScript files that have been compiled into JavaScript and will invalidate our data at the end. We only want to process the development code.
We wrap the glob request in a try-catch to report any errors to the console.
Create main function
Next, we want to call the function. Create another function called `calculateFilesCount` that will hold all the high-level functionality and display the results. Your file should look something like this now
This will print out the beginnings of a table, headed by the current date. The table I use is basic MarkDown and makes it easier to copy and paste the output into documentation later on.
Collect all the files
You can then start collecting the number of files by calling our getFilesCount function.
You can get more detailed to suit your project, or you could simply ignore all other file types and show just the JavaScript and TypeScript values if you want. For my project, I thought it was helpful to just show a small collection of file types, from images, data, documentation, HTML and CSS files.
I called our function that returned the number of files, and we store that value to display later and to calculate the total number of files.
Display everything
The last thing we need to do is display all the information we have along with the totals. Your final file should look like this
We are displaying each group of files with the number of files found, and using the total amount collected, to work out and display the percentage of the project that is made up of those files.
Running the file
And that is all there is to it. To run this script, open up a terminal, navigate to the folder and run the following command.
Further improvements
You can modify this further if you want to. I've made adjustments to allow for a parameter to be passed when running the script which prints out all the files. This was how I found out that the node_modules and other files were being included and giving me incorrect data to begin with.