The article that started it all and gave a SUPER LUCID explanation
https://iamturns.com/typescript-babel/
Some links from the Babel site that helped explain the setup tasks and why to use what features and configuration stuff.
https://babeljs.io/setup.html#installation https://babeljs.io/docs/en/configuration https://babeljs.io/docs/en/usage https://babeljs.io/docs/en/babel-cli
The announcement article from Microsoft
https://blogs.msdn.microsoft.com/typescript/2018/08/27/typescript-and-babel-7/
The Microsoft starter project
https://github.com/Microsoft/TypeScript-Babel-Starter
I added allowSyntheticDefaultImports: true to tsconfig.json
It's also important to note we need to install webpack-cli
npm install --save-dev webpack webpack-cli
https://webpack.js.org/guides/installation/
How to use path.resolve (I'm not good with Node stuff)
https://nodejs.org/api/path.html#path_path_resolve_paths
In order to polyfill all the extra features we need Babel's polyfill (which is core-js)
npm install --save @babel/polyfill
https://babeljs.io/docs/en/babel-polyfill
We can also not use Babel's polyfill and just use core-js features individually
npm install --save core-js
(I'm using Array.prototype.includes so I need the array features https://github.com/zloirock/core-js/tree/v2#ecmascript-6-array)
Either way, whatever we use we need to stick into the module.imports.entry array in webpack.config.js:
module.exports = {
entry: ["core-js/fn/array", "core-js/fn/whatever", path/to/entry-point],
// other stuff
}Externals, like jQuery, which I am using in an application because it is fast and easy. TL;DR: Just use a CDN unless it's a pain to do so