A Drastically Simple Angular Seed

The Angular "getting started" guide points you at angular-seed on GitHub as a repository you can clone to start an Angular project.

Unfortunately, this hasn't been updated in two years and when I tried building it I got a lot of complaints about the "bower" package manager being deprecated, and how I should switch to "yarn" instead.

So I wondered how hard it would be to create a seed from scratch. After ensuring node and yarn were up to date, here's what you need to do:

1. Initialize the project and add angular

yarn init
yarn add angular

The first will prompt for a bunch of information about your project: name, author, version, etc.

2. Create an index.html file

I created a src subdirectory, and put the following HTML file in it:

<!DOCTYPE html>
<html ng-app="app">
<head>
  <meta charset="utf-8">
  <title>Demo</title>
</head>
<body>
  <script src="../node_modules/angular/angular.js"></script>
  <script src="app/app.module.js"></script>
</body>
</html>

This is entirely the wrong way to load scripts in production, but we haven't written a build system yet.

3. Create an application module

In src/app/app.module.js:

// app.module.js
(() => {
    angular.module('app', [] );
})();

This creates the app-level module.

Congratulations! You have a perfectly empty Angular application! You can start adding components and modifying the template file from here.

A more realistic example

https://github.com/mgechev/angular-seed is a full-featured seed for Angular 2.

I found https://github.com/lackovic/angularjs-starter-kit more to my taste. It uses gulp as a build system and doesn't pull in anything else I don't understand. However, most Angular examples use TypeScript these days, so it might be better to use a seed that already uses the TypeScript compiler.

A Drastically Simple Angular Seed | Ecency