Setting up Webpack + TypeScript + VueJS from scratch

Recently I decided to play around with VueJS and TypeScript for a small fun project and discovered that there is precious little documentation on how to get them to work together well, and to be able to build via Webpack. The examples I found online provided "pre-packaged" complex solutions that included everything and the kitchen sink (i.e., an assortment of other packages that the developers like, unit test setup, etc.) Also, generally, the blogs I found tended to present what has to be done without explaining why. It took me much trial and Stack Overflow to get even the basic "Hello World" example from the official VueJS website to build correctly with TypeScript and Webpack rather than with Javascript and vue-cli.

To help others who might be facing a similar challenge, I created a Github repo with the very basic integration between Webpack, TypeScript and VueJS, and I wrote down a step-by-step explanation of how things are done and why.

https://github.com/lenkog/WebpackTSVueJS