Initial Setup (ESLint, Prettier, Git Hooks...) | Building an NPM Package with TypeScript
In this video, we will set up the linter, formatter, talk about how to use git commit messages to generate a CHANGELOG, and set up git hooks to execute some tasks on git actions. But first, let’s clone the repository and recap what files we have so far.
/ setting-up-npm-package-building-an-npm-pac...
At the moment, we have a .github folder that contains the issue templates and issue forms, the pull request template, and the code of conduct. Next, we have a .gitignore file that corresponds to the Node gitignore you can find on GitHub. We have the MIT License that we chose. And finally, our README file.
Let’s open the terminal and run npm init to initialize the npm package. Running npm init, we are prompted to specify every information about the package.
It starts with the package name, which will be the same as the name of the repo for us. Then, version, we are going to use semantic versioning for our package, starting with 1.0.0. The description is a copy of the one we wrote on GitHub for the repository.
Now, we need to specify the entry point. The entry point is essentially the file that will be used when someone requires your package.
The file that is required is the entry point that you have specified in the package.json. Because we are going to use a build tool that will transform our source file and create our final files into a library, we can specify the path of the build file. The file will be in the lib directory. And the file will be named postcss-debug-borders.js, the same as our package name.
For the test command, we are going to use Jest. Jest is a testing library by Facebook and contains everything you need to test javascript projects and applications. It includes an assertion library and can create the test coverage report, and has a test runner. It is popular, so it has good support for TypeScript. It also has good extensions for editors and IDEs.