Angular Library Seed
Seed project for Angular libraries that are AOT/JIT compatible and that use external SCSS-styles and HTML-templates
Overview
The angular-library-seed is a starter project for creating Angular libraries. It provides a reusable environment for building, testing, linting, documenting, exploring, and publishing libraries. The project includes the TickTock library example, which simply displays the current time. It is designed to be compatible with both AOT (Ahead of Time) and JIT (Just in Time) compilation, and allows for usage directly in browsers via a UMD bundle loaded by SystemJS. The project also supports writing component styles in external SCSS files and component templates in external HTML files.
Features
- AOT/JIT compatible library build via Angular Compiler (ngc)
- UMD build via Webpack for browser usage
- Testing with Karma and Jasmine
- Test coverage report via Istanbul
- Watch modes for building and testing procedures
- Linting with TSLint and Codelyzer for static code analysis
- Exploring build with Sourcemap Explorer for debugging
- Documentation generation via Compodoc
- Documentation hosting via GitHub Pages
- AOT/JIT/UMD demos via Webpack and SystemJS
- Continuous integration with Travis CI
- Code coverage badge via Codecov for test coverage reminder
Summary
The angular-library-seed is a starter project for creating Angular libraries. It provides a comprehensive environment for building, testing, linting, and documenting libraries, and supports both AOT and JIT compilation. It also offers features like UMD build for browser usage, code coverage reporting, and continuous integration with Travis CI. The installation process is straightforward, and users can easily replace the example library with their own custom library.
- Angular
Angular is a TypeScript-based open-source framework by Google for building dynamic single-page applications and cross-platform mobile apps with MVC architecture and a rich set of features.
- SCSS
SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.
- GitHub Pages
Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading
- Gulp
Gulp.js is an old but popular site building tool that automates various repetitive development tasks in web development, such as compiling Sass, minifying JavaScript, and optimizing images.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
- Webpack
Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.