Merge pull request #51 from CaerusKaru/lib

build: update build process to conform to Angular Package Format

Author: jeffwhelpley

.editorconfig

@@ -0,0 +1,14 @@
+# http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+
+[*.md]
+max_line_length = 0
+trim_trailing_whitespace = false

.gitignore

@@ -6,53 +6,23 @@ logs
 .DS_Store
 **/.DS_Store
 
-# Runtime data
-pids
-*.pid
-*.seed
+package-lock.json
+
+dist/
+node_modules/
+out-tsc/
+debug.log
+npm-debug.log
+src/**/*.js
+src/**/*.js.map
+src/**/*.d.ts
+utils/**/*.js
+utils/**/*.js.map
+utils/**/*.d.ts
+integration/src/**/*.js
+integration/e2e/**/*.js
+integration/**/*.js.map
+integration/**/*.d.ts
+*.metadata.json
+*.ngsummary.json
 
-typings
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-/lib-cov
-
-# Coverage directory used by tools like istanbul
-/coverage
-
-# Dependency directory
-# Commenting this out is preferred by some people, see
-# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git-
-node_modules
-
-# used for karma unit test coverage
-test/coverage
-
-# Users Environment Variables
-.lock-wscript
-
-# Static files
-
-/bower_components/
-/web_modules/
-/dist
-
-# Typings
-/typings/main
-/typings/browser
-/typings/main.d.ts
-/typings/browser.d.ts
-/tsd_typings
-/docs
-
-/src/**/*.js
-/src/**/*.d.ts
-/test/**/*.js
-/test/**/*.d.ts
-/server.js
-/server.d.ts
-/browser.js
-/browser.d.ts
-/record.js
-/record.d.ts
-/replay.js
-/replay.d.ts

.npmignore

@@ -4,3 +4,16 @@
 .DS_Store
 *.pid
 *.seed
+
+# top-level files
+CONTRIBUTING.md
+package-lock.json
+prettier.config.js
+protractor.conf.js
+tsconfig.json
+tslint.json
+
+# top-level directories
+build
+src
+test

CONTRIBUTING.md

@@ -1,6 +1,6 @@
 # Contributing to Preboot
 
-We would love for you to contribute to Angular 2 and help make it even better than it is
+We would love for you to contribute to Preboot and help make it even better than it is
 today! As a contributor, here are the guidelines we would like you to follow:
 
  - [Code of Conduct](#coc)
@@ -13,12 +13,13 @@ today! As a contributor, here are the guidelines we would like you to follow:
  - [Signing the CLA](#cla)
 
 ## <a name="coc"></a> Code of Conduct
-Help us keep Angular open and inclusive. Please read and follow our [Code of Conduct][coc].
+Help us keep Preboot open and inclusive. Please read and follow our [Code of Conduct][coc].
 
 ## <a name="question"></a> Got a Question or Problem?
 
 If you have questions about how to *use* Preboot, please direct them to [Gitter][gitter].
-There is also a [Slack](https://angular-universal.slack.com) ground that we would be hapy to invite you to. Just ping [@jeffwhelpley](https://twitter.com/jeffwhelpley)
+There is also a [Slack](https://angular-universal.slack.com) ground that we would be happy to invite you to. 
+Just ping [@jeffwhelpley](https://twitter.com/jeffwhelpley)
 or [@gdi2290](https://twitter.com/gdi2290) on [Twitter](https://twitter.com) or [Gitter][gitter].
 
 ## <a name="issue"></a> Found an Issue?
@@ -29,8 +30,7 @@ If you find a bug in the source code or a mistake in the documentation, you can
 ## <a name="feature"></a> Want a Feature?
 You can *request* a new feature by [submitting an issue](#submit-issue) to our [GitHub
 Repository][github]. If you would like to *implement* a new feature, please submit an issue with
-a proposal for your work first, to be sure that we can use it. Angular 2 is in developer preview
-and we are not ready to accept major contributions ahead of the full release.
+a proposal for your work first, to be sure that we can use it.
 Please consider what kind of change it is:
 
 * For a **Major Feature**, first open an issue and outline your proposal so that it can be
@@ -50,7 +50,7 @@ chances of your issue being dealt with quickly:
 
 * **Overview of the Issue** - if an error is being thrown a non-minified stack trace helps
 * **Preboot Version** - what version is affected
-* **Motivation for or Use Case** - explain what are you trying to do and why the current behavior is a bug for you
+* **Motivation for or Use Case** - explain what you are trying to do and why the current behavior is a bug for you
 * **Browsers and Operating System** - is this a problem with all browsers?
 * **Reproduce the Error** - provide a live example (using [Plunker][plunker],
   [JSFiddle][jsfiddle] or [Runnable][runnable]) or a unambiguous set of steps
@@ -95,7 +95,7 @@ Before you submit your Pull Request (PR) consider the following guidelines:
 * In GitHub, send a pull request to `preboot:master`.
 * If we suggest changes then:
   * Make the required updates.
-  * Re-run the Angular 2 test suites for JS and Dart to ensure tests are still passing.
+  * Re-run the Preboot test suites to ensure tests are still passing.
   * Rebase your branch and force push to your GitHub repository (this will update your Pull Request):
 
     ```shell
@@ -167,7 +167,8 @@ Any line of the commit message cannot be longer 100 characters! This allows the
 to read on GitHub as well as in various git tools.
 
 ### Revert
-If the commit reverts a previous commit, it should begin with `revert: `, followed by the header of the reverted commit. In the body it should say: `This reverts commit <hash>.`, where the hash is the SHA of the commit being reverted.
+If the commit reverts a previous commit, it should begin with `revert: `, followed by the header of the reverted commit. 
+In the body it should say: `This reverts commit <hash>.`, where the hash is the SHA of the commit being reverted.
 
 ### Type
 Must be one of the following:
@@ -180,7 +181,8 @@ Must be one of the following:
 * **refactor**: A code change that neither fixes a bug nor adds a feature
 * **perf**: A code change that improves performance
 * **test**: Adding missing tests or correcting existing tests
-* **build** Changes that affect the build system, CI configuration or external dependencies (example scopes: gulp, broccoli, npm)
+* **build** Changes that affect the build system, CI configuration or external dependencies 
+(example scopes: gulp, broccoli, npm)
 * **chore**: Other changes that don't modify `src` or `test` files
 
 ### Scope
@@ -202,7 +204,8 @@ The body should include the motivation for the change and contrast this with pre
 The footer should contain any information about **Breaking Changes** and is also the place to
 reference GitHub issues that this commit **Closes**.
 
-**Breaking Changes** should start with the word `BREAKING CHANGE:` with a space or two newlines. The rest of the commit message is then used for this.
+**Breaking Changes** should start with the word `BREAKING CHANGE:` with a space or two newlines. The rest of the commit 
+message is then used for this.
 
 A detailed explanation can be found in this [document][commit-message-format].
 

README.md

@@ -21,62 +21,38 @@ cd into your app root and run the following command:
 npm i preboot --save
 ```
 
-There are two parts of preboot (server configuration and browser configuration). For each part of preboot, there is a slightly different API for Angular and non-Angular apps. The following sections covers these 4 different configurations:
+The following sections covers the three different configurations of preboot:
 
-- Angular Server Configuration
-- Angular Browser Configuration
+- Angular Configuration
 - Non-Angular Server Configuration
 - Non-Angular Browser Configuration
 
-#### Angular Server Configuration
+#### Angular Configuration
 
-```
+```typescript
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-import { ServerModule } from '@angular/platform-server';
-import { ServerPrebootModule } from 'preboot/server';
+import { PrebootModule } from 'preboot';
 import { AppComponent } from './app.component';
 
 @NgModule({
   declarations: [AppComponent],
   imports: [
     BrowserModule.withServerTransition({ appId: 'foo' }),
-    ServerModule,
-    ServerPrebootModule.recordEvents({ appRoot: 'app-root' })
-  ],
-  bootstrap: [AppComponent]
-})
-export class AppModule { }
-```
-
-The key part here for preboot is to include `ServerPrebootModule.recordEvents({ appRoot: 'app-root' })` where the `appRoot`
-is the selector to find the root of your application. The options you can pass into `recordEvents()` are in the [PrebootRecordOptions](#PrebootRecordOptions) section below. In most cases, however, you will only need to specify the `appRoot`.
-
-#### Angular Browser Configuration
-
-```
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { BrowserPrebootModule } from 'preboot/browser';
-import { AppComponent } from './app.component';
-
-@NgModule({
-  declarations: [AppComponent],
-  imports: [
-    BrowserModule,
-    BrowserPrebootModule.replayEvents()
+    PrebootModule.withConfig({ appRoot: 'app-root' })
   ],
   bootstrap: [AppComponent]
 })
 export class AppModule { }
 ```
 
-The key part here for preboot is to include `BrowserPrebootModule.replayEvents()`. You can optionally pass an object into `replayEvents()` that is detailed in the [PrebootReplayOptions](#PrebootReplayOptions) section further below. In most cases, however, you can just rely on the preset defaults.
+The key part here for preboot is to include `PrebootModule.withConfig({ appRoot: 'app-root' })` where the `appRoot`
+is the selector(s) to find the root of your application. The options you can pass into `withConfig()` are in the [PrebootOptions](#PrebootOptions) section below. In most cases, however, you will only need to specify the `appRoot`.
 
 #### Non-Angular Server Configuration
 
 ```
-import { getInlinePrebootCode } from 'preboot/record';
+import { getInlinePrebootCode } from 'preboot';
 
 const prebootOptions = {};  // see PrebootRecordOptions section below
 const inlineCode = getInlinePrebootCode(prebootOptions);
@@ -88,25 +64,50 @@ const inlineCode = getInlinePrebootCode(prebootOptions);
 #### Non-Angular Browser Configuration
 
 ```
-import { EventReplayer } from 'preboot/replay';
+import { EventReplayer } from 'preboot';
 
 const replayer = new EventReplayer();
 
 // once you are ready to replay events (usually after client app fully loaded)
 replayer.replayAll();
 ```
 
-#### PrebootRecordOptions
+#### PrebootOptions
 
 * `appRoot` (**required**) - One or more selectors for apps in the page (i.e. so one string or an array of strings).
 * `buffer` (default true) - If true, preboot will attempt to buffer client rendering to an extra hidden div. In most
 cases you will want to leave the default (i.e. true) but may turn off if you are debugging an issue.
-* `minify` (default true) - If true, the inline code for recording will be minified in the server view. We recommend
-only setting this to false if you are debugging an issue.
+* `minify` (deprecated) - minification has been removed in v6. Minification should be handled by the end-user
 * `eventSelectors` (defaults below) - This is an array of objects which specify what events preboot should be listening for 
 on the server view and how preboot should replay those events to the client view. 
 See Event Selector section below for more details but note that in most cases, you can just rely on the defaults
 and you don't need to explicitly set anything here.
+* `noReplay` (default false) - The only reason why you would want to set this to true is if you want to
+manually trigger the replay yourself. This contrasts with the event selector `noReplay`, because this option is global
+
+This comes in handy for situations where you want to hold off
+on the replay and buffer switch until AFTER some async events occur (i.e. route loading, http calls, etc.). By
+default, replay occurs right after bootstrap is complete. In some apps, there are more events after bootstrap
+however where the page continues to change in significant ways. Basically if you are making major changes to
+the page after bootstrap then you will see some jank unless you set `noReplay` to `true` and then trigger replay
+yourself once you know that all async events are complete.
+
+To manually trigger replay, simply inject the EventReplayer like this:
+
+```
+import { Injectable } from '@angular/core';
+import { EventReplayer } from 'preboot';
+
+@Injectable()
+class Foo {
+  constructor(private replayer: EventReplayer) {}
+
+  // you decide when to call this based on what your app is doing
+  manualReplay() {
+    this.replayer.replayAll();
+  }
+}
+```
 
 **Event Selectors**
 
@@ -147,37 +148,6 @@ var eventSelectors = [
 ];
 ```
 
-#### PrebootReplayOptions
-
-This is only used with the Angular browser configuration for preboot.
-
-* `noReplay` (default false) - The only reason why you would want to set this to true is if you want to
-manually trigger the replay yourself. 
-
-This comes in handy for situations where you want to hold off
-on the replay and buffer switch until AFTER some async events occur (i.e. route loading, http calls, etc.). By
-default, replay occurs right after bootstrap is complete. In some apps, there are more events after bootstrap
-however where the page continues to change in significant ways. Basically if you are making major changes to
-the page after bootstrap then you will see some jank unless you set `noReplay` to `true` and then trigger replay
-yourself once you know that all async events are complete.
-
-To manually trigger replay, simply inject the EventReplayer like this:
-
-```
-import { Injectable } from '@angular/core';
-import { EventReplayer } from 'preboot/browser';
-
-@Injectable()
-class Foo {
-  constructor(private replayer: EventReplayer) {}
-
-  // you decide when to call this based on what your app is doing
-  manualReplay() {
-    this.replayer.replayAll();
-  }
-}
-```
-
 #### PrebootComplete
 
 When you are manually replaying events, you often will want to know when Preboot
@@ -197,7 +167,7 @@ Preboot allows you to configure this by exporting an optional `PREBOOT_NONCE` to
 Example usage is as follows (for an Express server):
 
 ```typescript
-import {PREBOOT_NONCE} from 'preboot/src';
+import {PREBOOT_NONCE} from 'preboot';
 import * as express from 'express';
 import {v4} from 'uuid';
 import * as csp from 'helmet-csp';
@@ -226,8 +196,8 @@ app.get('*', (req, res) => {
     res,
     providers: [
       {
-	  provide: PREBOOT_NONCE,
-	  useValue: res.locals.nonce
+        provide: PREBOOT_NONCE,
+        useValue: res.locals.nonce
       }
     ]
   });
@@ -248,4 +218,4 @@ res.render('index', (req, res) => {
   console.log(html.substring(0, 50)); // we only care about the top part
   res.send(html);
 });
-```
+```

browser.ts

@@ -0,0 +1,9 @@
+{
+  "server": {
+    "baseDir": "src/demo",
+    "routes": {
+      "/node_modules": "node_modules",
+      "/preboot": "src/lib"
+    }
+  }
+}