unlight / angular-webpack-seed

Angular 2 seed project - Webpack 2, TypeScript 2, Angular 4+, Karma / Nightmare 2, Stryker, Gulp 4, ESLint and more

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

angular-webpack-seed

Angular X single page application starter.

STACK

  • Angular 4+
  • TypeScript 2
  • Webpack 2
  • Karma / NightmareJS 2 (Electron)
  • Stryker
  • Gulp 4
  • ESLint with useful plugins

FEATURES

  • Fastest typescript compilation (because of transpileOnly)
  • Faster unit testing (NightmareJS runs 2 times faster than PhantomJS)
  • Hot reload, HMR (Hot Module Replacement)
  • AoT (with routes lazy loading)
  • Mutation testing
  • Conditional linting for source and spec files

QUICK START

git clone https://github.com/unlight/angular-webpack-seed && cd angular-webpack-seed
npm i 
npm run start

HUSKY

  • Install: npm i husky
  • Uninstall: npm r husky

TASKS

Task Description
npm run start Prepare and start local dev server
npm run build:vendors Prepare npm dependencies for linking
npm run build:libs Prepare npm dependencies for linking (Scripts)
npm run build:style Prepare npm dependencies for linking (Design)
npm run server Local dev server
npm run server:dashboard Local dev server in dashboard mode
npm run clean Clean generated folders
npm run eslint Lint code (single run mode)
npm run gulp eslint:watch ESLint in watch mode
npm run t Run unit testing in single run mode
npm run test:all Sequence of eslint, tschk and coverage tasks
npm run test:w Run unit testing in watch mode
npm run up Update all dependencies one by one running tests after each
npm run tschk Run typescript compile but do not emit files (useful for typechecking)
npm run tschk:w tschk in watch mode
npm run build Build application, but not dependencies
npm run build:all Sequence of build:vendors and build tasks
npm run build:release Clean rebuild all
npm run coverage Run test coverage with verbose reporing
npm run coverage:debug Run coverage task in debug mode
npm run p "t1" "t2" Run tasks in parallel
npm run stryker Run mutation tests

DEVELOPMENT TIPS

  • Do not disable cache in devtools (network tab): this improves speed significantly, use Ctrl + F5 to clean cache.
  • Try to add new external libraries (npm modules) to vendor libs list (entry.libs) and do npm run build:libs

RESOURCES

KNOWN ISSUES

TODO

DEBUG

inspect node_modules/webpack-dev-server/bin/webpack-dev-server
inspect --debug-exception node_modules/webpack/bin/webpack.js --env.prod --display-modules
inspect --debug-exception node_modules/webpack/bin/webpack.js

About

Angular 2 seed project - Webpack 2, TypeScript 2, Angular 4+, Karma / Nightmare 2, Stryker, Gulp 4, ESLint and more


Languages

Language:TypeScript 74.8%Language:JavaScript 19.8%Language:CSS 2.7%Language:HTML 2.7%