💣 init

Hendrixer · Hendrixer · commit 5acd2a259fbd · 2017-05-18T17:01:16.000-04:00
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,10 @@
+node_modules
+*.log
+*.tmp
+DS*
+typings
+dist
+.vscode
+*.pid
+*.seed
+build/Release
diff --git a/README.md b/README.md
@@ -0,0 +1,31 @@
+# Angular Lib starter
+> Universal, AOT, Web Workers, ready lib starter. Use for your Angular libs
+
+
+## Getting started
+* fork this
+* clear the git history `git init .`
+* add your source code in `src`.
+* change the entry in `webpack.config.js`
+* change the output filnames in `package.json` to match your src files and webpack
+  * `"main", "jsnext:main", "module", "types"`
+* build your project `yarn release` or `npm run release`
+
+## Builds
+This starter prepares 2 different versions for builds of your lib
+* **esm** or ES2015 Modules
+  * this build is a transpilation of your Typescript code to ES5 and ES2015 modules. Its' not bundled. This is needed for treeshaking when users use your lib
+* **UMD**
+  * this is a bundle of ES5 code. What you would typically get from webpack or rollup.
+
+The build system generates AOT metadata too, so you're good.
+
+
+## Scripts
+* `"test"`: runs the test in mocha on node
+* `"build:esm"`: builds the esm versions
+* `"build:bundle"`: builds the UMD version
+* `"build:aot"`: makes it work for aot
+* `"build"`: does all the above
+* `"copy"`: copies over file to dist
+* `"release"`: does all the above
diff --git a/custom.d.ts b/custom.d.ts
@@ -0,0 +1 @@
+declare module '*'
diff --git a/mocha.opts b/mocha.opts
@@ -0,0 +1,6 @@
+--webpack-config ./webpack.testing.js
+--require ./test-shim.js
+--ui bdd
+--glob *.spec.ts
+--recursive
+src
diff --git a/package.json b/package.json
@@ -0,0 +1,53 @@
+{
+  "name": "angular-lib-starter",
+  "version": "0.0.1",
+  "description": "Starter to make Angular libs",
+  "main": "bundle.js",
+  "jsnext:main": "lib.module.js",
+  "module": "lib.module.js",
+  "types": "index.d.ts",
+  "scripts": {
+    "test": "rimraf ./tmp/mocha-webpack && mocha-webpack --opts 'mocha.opts'",
+    "build:esm": "ntsc -p tsconfig.esm.json",
+    "build:bundle": "webpack --progress --colors",
+    "build:aot": "ngc",
+    "build": "rimraf build && npm run build:esm && npm run build:bundle && npm run build:aot",
+    "copy": "cp package.json dist && cp README.md dist",
+    "release": "npm run build && npm run copy"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@angular/common": "^4.1.3",
+    "@angular/compiler": "^4.1.3",
+    "@angular/compiler-cli": "^4.1.3",
+    "@angular/core": "^4.1.3",
+    "@angular/platform-browser": "^4.1.3",
+    "@angular/platform-browser-dynamic": "^4.1.3",
+    "@angular/platform-server": "^4.1.3",
+    "@types/chai": "^3.5.2",
+    "@types/mocha": "^2.2.41",
+    "@types/node": "^7.0.18",
+    "@types/sinon": "^2.2.2",
+    "angular2-template-loader": "^0.6.2",
+    "awesome-typescript-loader": "^3.1.3",
+    "core-js": "^2.4.1",
+    "jsdom": "^10.1.0",
+    "mocha": "^3.4.1",
+    "mocha-webpack": "^0.7.0",
+    "ntypescript": "latest",
+    "raw-loader": "^0.5.1",
+    "rimraf": "^2.6.1",
+    "rxjs": "^5.4.0",
+    "source-map-support": "^0.4.15",
+    "typescript": "^2.3.2",
+    "webpack": "^2.5.1",
+    "webpack-node-externals": "^1.6.0",
+    "zone.js": "^0.8.10"
+  },
+  "dependencies": {
+    "css-loader": "^0.28.1",
+    "postcss-loader": "^2.0.5",
+    "sass-loader": "^6.0.5",
+    "to-string-loader": "^1.1.5"
+  }
+}
diff --git a/src/index.ts b/src/index.ts
@@ -0,0 +1 @@
+export * from './lib.module'
diff --git a/src/lib.component.html b/src/lib.component.html
@@ -0,0 +1,3 @@
+<div class="lib">
+  hello
+</div>
diff --git a/src/lib.component.ts b/src/lib.component.ts
@@ -0,0 +1,7 @@
+import { Component } from '@angular/core'
+
+@Component({
+  selector: 'lib',
+  template: require('./lib.component.html')
+})
+export class LibComponent {}
diff --git a/src/lib.module.ts b/src/lib.module.ts
@@ -0,0 +1,11 @@
+import {NgModule} from '@angular/core'
+import {CommonModule} from '@angular/common'
+import { LibComponent } from './lib.component'
+
+
+@NgModule({
+  imports: [CommonModule],
+  declarations: [LibComponent],
+  exports: [LibComponent]
+})
+export class LibModule {}
diff --git a/src/lib.spec.ts b/src/lib.spec.ts
@@ -0,0 +1,5 @@
+describe('test', () => {
+  it('should be dope', () => {
+    console.log('hello')
+  })
+})
diff --git a/test-shim.js b/test-shim.js
@@ -0,0 +1,35 @@
+require('source-map-support').install({
+  environment: 'node'
+});
+
+const jsdom = require('jsdom');
+
+const {window} = new jsdom.JSDOM('<!doctype html><html><body></body></html>');
+
+
+// global.window = global.Window = window
+global.document = window.document;
+global.mediaMatch = window.mediaMatch;
+global.HTMLElement = window.HTMLElement;
+global.XMLHttpRequest = window.XMLHttpRequest;
+global.Node = window.Node;
+// global.scrollTo = window.scrollTo;
+// global.history = window.history;
+// global.clearInterval = window.clearInterval;
+// global.pageYOffset = window.pageYOffset;
+// global.sinon = require('sinon');
+
+require('core-js/es6');
+require('core-js/es7/reflect');
+
+require('zone.js/dist/zone');
+require('zone.js/dist/long-stack-trace-zone');
+require('zone.js/dist/proxy');
+require('zone.js/dist/sync-test');
+require('zone.js/dist/async-test');
+require('zone.js/dist/fake-async-test');
+
+var testing = require('@angular/core/testing');
+var browser = require('@angular/platform-browser-dynamic/testing');
+
+testing.TestBed.initTestEnvironment(browser.BrowserDynamicTestingModule, browser.platformBrowserDynamicTesting());
diff --git a/tsconfig.esm.json b/tsconfig.esm.json
@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "es2015",
+    "sourceMap": true,
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "stripInternal": true,
+    "declaration": true,
+    "outDir": "./dist",
+    "lib": ["es2015", "dom"]
+  },
+  "files": [
+    "./src/index.ts"
+  ]
+}
diff --git a/tsconfig.json b/tsconfig.json
@@ -0,0 +1,31 @@
+{
+  "angularCompilerOptions": {
+    "skipTemplateCodegen": true
+  },
+  "compilerOptions": {
+    "declaration": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "lib": [
+      "es2015",
+      "dom"
+    ],
+    "module": "commonjs",
+    "outDir": "./dist",
+    "sourceMap": true,
+    "stripInternal": true,
+    "target": "es5",
+    "typeRoots": [
+      "./node_modules/@types",
+      "./node_modules"
+    ],
+    "types": [
+      "node",
+      "mocha",
+      "chai"
+    ]
+  },
+  "files": [
+    "./src/index.ts"
+  ]
+}
diff --git a/tslint.json b/tslint.json
@@ -0,0 +1,63 @@
+{
+  "rulesDirectory": ["node_modules/tslint-no-unused-var"],
+  "rules": {
+    "max-line-length": [true, 100],
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space"
+    ],
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "eofline": true,
+    "no-duplicate-variable": true,
+    "no-eval": true,
+    "no-arg": true,
+    "no-internal-module": true,
+    "no-trailing-whitespace": true,
+    "no-bitwise": true,
+    "no-shadowed-variable": true,
+    "no-unused-expression": true,
+    "no-unused-var": [true, {"ignore-pattern": "^(_.*)$"}],
+    "one-line": [
+      true,
+      "check-catch",
+      "check-else",
+      "check-open-brace",
+      "check-whitespace"
+    ],
+    "quotemark": [
+      true,
+      "single",
+      "avoid-escape"
+    ],
+    // "semicolon": false,
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "curly": true,
+    "variable-name": [
+      true,
+      "ban-keywords",
+      "check-format",
+      "allow-leading-underscore"
+    ],
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-decl",
+      "check-operator",
+      "check-separator",
+      "check-type"
+    ]
+  }
+}
diff --git a/webpack.config.js b/webpack.config.js
@@ -0,0 +1,64 @@
+const webpack = require('webpack')
+const path = require('path')
+const root = (_path) => {
+  return path.resolve(__dirname, _path)
+}
+const moduleExternals = require('webpack-node-externals')
+
+module.exports = (envOptions = {}) => {
+  return ({
+    entry: root('./src/index.ts'),
+    output: {
+      path: root('dist'),
+      filename: 'bundle.js'
+    },
+    target: 'web',
+    externals: [moduleExternals()],
+    resolve: {
+      extensions: ['.ts', '.js', '.html', '.scss', '.css'],
+    },
+    module: {
+      rules: [
+        {
+          test: /\.ts$/,
+          loaders: [
+            {
+              loader: 'awesome-typescript-loader',
+              options: {
+                declaration: false
+              }
+            },
+            'angular2-template-loader'
+          ],
+          exclude: [/node_modules/, /\.spec\.ts$/]
+        },
+        {
+          test: /\.html$/,
+          loader: 'raw-loader'
+        },
+        {
+          test: /\.gql$/,
+          loader: 'graphql-tag/loader'
+        },
+        {
+          test: /\.scss$/,
+          use: [
+            'to-string-loader',
+            'css-loader',
+            'postcss-loader',
+            'sass-loader'
+          ]
+        }
+      ]
+    },
+    plugins: [
+      new webpack.ContextReplacementPlugin(
+        /angular(\\|\/)core(\\|\/)@angular/,
+        root('src'), // location of your src
+        {
+          // your Angular Async Route paths relative to this root directory
+        }
+      )
+    ]
+  })
+}
diff --git a/webpack.testing.js b/webpack.testing.js
diff --git a/yarn.lock b/yarn.lock

-Original file line number
+Diff line change
@@ @@ -0,0 +1,10 @@ @@
 +node_modules
 +*.log
 +*.tmp
 +DS*
 +typings
 +dist
 +.vscode
 +*.pid
 +*.seed
 +build/Release
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+<div class="lib">`
	`2`	`+ hello`
	`3`	`+</div>`