This repo is a basic setup to get you started with Angular 2 && TypeScript.
Modules used:
- watchify - to recompile your bundle when updating files during development
- tsify - to transpile your TypeScript code
- factor-bundle - to make sure common dependencies stay in their own bundle, so that rebundling takes less time (since only the code you actually create gets rebundled)
npm i
npm run go
Easy to understand setup, only a few npm scripts involved. You won't load 100
JavaScript files in development with HTTP 1.1 (like the SystemJS setup does) nor
will you have tens of lines of configuration just to get you started (like a
webpack.config.js
file has).
- Be sure to add your NPM dependencies in
app/vendor.ts
, even though you are also using them inapp/main.ts
. That allowsfactor-bundle
to store them (the "common" dependencies) in a separatecommon.js
file, working nicely withwatchify
so that only the code you write is getting rebundled in development. - Currently there is an error in the console coming from
app/vendor.ts
. However it doesn't seem to impact anything and it goes away if everything is bundled together (like you would do for production for HTTP !== 2.0), so just ignore it for the time being.
Q: But I really like to import html like I do in Webpack.
A: Use stringify and update the npm
build
script accordingly.
Q: Why can't you use SystemJS or Webpack like everybody else?
A: SystemJS is a pain in development because it makes me load a ton of files, and the development servers aren't using HTTP 2.0 so far. Webpack is a powerful solution, but that config file can grow quite big even though my needs are simple.