Library bootstrap

[at15]

google how to write angular 4 library

• https://hackernoon.com/how-to-create-library-in-angular-2-and-publish-to-npm-from-scratch-f2b1272d6266
• https://www.tsmean.com/articles/how-to-write-a-typescript-library/angular/ generate a new app and created a module inside it
• https://github.com/angular/angular-cli/issues/6510
• https://github.com/angular/angular-cli/issues/3580 very short discussion
• https://github.com/angular/angular-cli/issues/1692
  • https://github.com/nsmolenskii/ng-demo-lib which ships typescript directly, a working workaround
• https://github.com/filipesilva/angular-quickstart-lib 172 star (by maintainer of angular cli)
  • PR is https://github.com/angular/angular/pull/16486
  • doc is https://pr16486-1c9e4ce4cd170640def0191d93a57c88a22bf7aa.ngbuilds.io/guide/third-party-lib
• https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs/preview angular package format
• other examples
  • ng bootstrap https://github.com/ng-bootstrap/ng-bootstrap/blob/master/package.json
  • ng semantic ui https://github.com/edcarroll/ng2-semantic-ui

[at15]

Tried https://github.com/filipesilva/angular-quickstart-lib

Pros

• e2e test
• demo application
  • [ ] can we turn the demo application into documentation like ng2-semantic-ui
• uses browser-sync (which is pretty cool and I didn't know ...

Cons

• need to run string replacement
• js, map files are generated along side typescript, which is quite annoying .... this is mentioned in https://github.com/filipesilva/angular-quickstart-lib/issues/47

[at15]

It might be easier to just ship ts for now (improved copy and paste) ... since myself is the only user for most of libraries ...

[at15]

in ng2-semantic-ui's demo, path is set https://github.com/edcarroll/ng2-semantic-ui/blob/master/demo/src/tsconfig.json to point to the library

{
  "compilerOptions": {
    "baseUrl": "",
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"],
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "outDir": "../../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../../node_modules/@types"
    ],
    "paths": {
      "ng2-semantic-ui": ["../../src/public"],
      "ng2-semantic-ui/locales": ["../../src/behaviors/localization/locales"]
    },
    "types": [
      "prismjs"
    ]
  },
  "include": [
    "**/*.ts"
  ]
}