From 91c36a246c3d6760fdfffd6e04ad68d0b48a1901 Mon Sep 17 00:00:00 2001 From: Paul Taylor Date: Thu, 24 Aug 2017 10:37:05 -0700 Subject: [PATCH] build(ts): add ts target and @angular/cli integration instructions --- .gitignore | 1 + gulpfile.js | 30 ++++++++++++++++++--- lerna.json | 1 + package.json | 1 + readme.md | 74 ++++++++++++++++++++++++++++++++++++++-------------- 5 files changed, 84 insertions(+), 23 deletions(-) diff --git a/.gitignore b/.gitignore index 49eb545e..a4870191 100644 --- a/.gitignore +++ b/.gitignore @@ -45,6 +45,7 @@ doc # compilation targets dist types +targets/ts targets/es5 targets/es2015 targets/esnext diff --git a/gulpfile.js b/gulpfile.js index b6896d57..af0378d7 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -44,6 +44,9 @@ for (const [target, format] of combinations([`all`, `all`])) { gulp.task(`clean:${combo}`, ...cleanTask(target, format, combo, `targets/${target}/${format}`)); gulp.task(`bundle:${combo}`, ...bundleTask(target, format, combo, `targets/${target}/${format}`)); } +gulp.task(`build:ts`, ...copySrcTask(`ts`, ``, `ts`, `targets/ts`)); +gulp.task(`clean:ts`, ...cleanTask(`ts`, ``, `ts`, `targets/ts`)); +gulp.task(`bundle:ts`, ...bundleTask(`ts`, ``, `ts`, `targets/ts`)); gulp.task(`default`, [`build`]); gulp.task(`test`, (cb) => runTaskCombos(`test`, cb)); @@ -60,6 +63,13 @@ function runTaskCombos(name, cb) { } combos.push(`${name}:${target}:${format}`); } + if (name === `bundle`) { + if (~targets.indexOf(`ts`)) { + combos.push(`${name}:ts`); + } else if (targets[0] === `all` && modules[0] === `all`) { + combos.push(`${name}:ts`); + } + } gulp.start(combos, cb); } @@ -83,7 +93,20 @@ function buildTask(target, format, taskName, outDir) { : typescriptTask(target, format, taskName, outDir); } +function copySrcTask(target, format, taskName, outDir) { + return [ + [`clean:${taskName}`], + () => gulp.src([`src/**/*`]).pipe(gulp.dest(outDir)) + ]; +} + function bundleTask(target, format, taskName, outDir) { + const nameComponents = [target]; + const ext = target === `ts` ? `ts` : `js`; + const typings = target === `ts` ? `Ix.ts` : null; + if (format) { + nameComponents.push(format); + } return [ [`build:${taskName}`], (cb) => streamMerge([ @@ -96,10 +119,11 @@ function bundleTask(target, format, taskName, outDir) { `license`, `keywords`, `typings`, `repository`, `peerDependencies` ].reduce((copy, key) => ( - (copy[key] = orig[key]) && copy || copy + (copy[key] = copy[key] || orig[key]) && copy || copy ), { - main: `Ix.js`, - name: `@reactivex/${orig.name}-${target}-${format}` + typings, + main: `Ix.${ext}`, + name: `@reactivex/${[orig.name, ...nameComponents].join('-')}` }), 2), gulp.dest(outDir), onError diff --git a/lerna.json b/lerna.json index 3e1c09ff..695feb39 100644 --- a/lerna.json +++ b/lerna.json @@ -2,6 +2,7 @@ "lerna": "2.0.0", "version": "2.0.1", "packages": [ + "targets/ts", "targets/es5/*", "targets/es2015/*", "targets/esnext/*" diff --git a/package.json b/package.json index d21f8fcd..8af15ed5 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "AsyncIterator" ], "files": [ + "src", "dist", "types", "targets", diff --git a/readme.md b/readme.md index 7b2cb549..cbf4921f 100644 --- a/readme.md +++ b/readme.md @@ -1,19 +1,50 @@ -[![Build Status](https://travis-ci.org/ReactiveX/IxJS.svg?branch=master)](https://travis-ci.org/ReactiveX/IxJS) +# The Interactive Extensions for JavaScript (IxJS) -# The Interactive Extensions for JavaScript (IxJS)... +[![Build Status](https://travis-ci.org/ReactiveX/IxJS.svg?branch=master)](https://travis-ci.org/ReactiveX/IxJS) -*...is a set of libraries to compose synchronous and asynchronous collections and [Array#extras](http://blogs.msdn.com/b/ie/archive/2010/12/13/ecmascript-5-part-2-array-extras.aspx) style composition in JavaScript* +*IxJS is a set of libraries to compose synchronous and asynchronous collections and [Array#extras](http://blogs.msdn.com/b/ie/archive/2010/12/13/ecmascript-5-part-2-array-extras.aspx) style composition in JavaScript* The Interactive Extensions for JavaScript (IxJS) brings the Array#extras combinators to iterables, generators, async iterables and async generators. With the introduction of the `Symbol.iterator` and generators in ES2015, and subsequent introduction of `Symbol.asyncIterator` and async generators, it became obvious we need an abstraction over these data structures for composition, querying and more. IxJS unifies both synchronous and asynchronous pull-based collections, just as RxJS unified the world of push-based collections. RxJS is great for event-based workflows where the data can be pushed at the rate of the producer, however, IxJS is great at I/O operations where you as the consumer can pull the data when you are ready. ## Install [IxJS from npm](https://www.npmjs.com/package/ix) + ```sh npm install ix ``` + (also read about how we [package IxJS](#packaging) below) +## Usage with `@angular/cli` + +First, make sure you're using `@angular/cli` v1.3.2 or greater (1.3.1 has a bug that broke tsconfig's "paths" entries). + +Next, install the TypeScript-only module: + +```sh +npm install @reactivex/ix-ts +``` + +Then, add these entries to your top-level `tsconfig.json` file: + +```js +{ + "compilerOptions": { + "importHelpers": true, /* <-- optional but recommended */ + "noEmitHelpers": true, /* <-- optional but recommended */ + "downlevelIteration": true, + "paths": { + "ix/*": ["../node_modules/@reactivex/ix-ts/*"] + }, + "lib": [ + "esnext.asynciterable" /* <-- in addition to any other "lib" entries you have */ + ] + } +} + +``` + ## `Iterable` The `Iterable` class a way to create and compose synchronous collections much like Arrays, Maps and Sets in JavaScript using the Array#extras style using the familiar methods you are used to like `map`, `filter`, `reduce` and more. @@ -86,7 +117,7 @@ const filters = require('ix/iterable/filter').filter; const source = [1,2,3]; const results = map( filter( - source, + source, x => x % 2 === 0 ), x => x * x @@ -233,7 +264,7 @@ const source = async function* () { const results = map( filter( - source(), + source(), x => x % 2 === 0 ), x => x * x @@ -316,7 +347,7 @@ for await (let item of mapped) { } ``` -In addition, you can use the specialized async methods that are suffixed with `Async`, such as `mapAsync`, `filterAsync`, `flatMapAsync` amongst others. These functions accept async functions which allow you to return a `Promise` as the result. +In addition, you can use the specialized async methods that are suffixed with `Async`, such as `mapAsync`, `filterAsync`, `flatMapAsync` amongst others. These functions accept async functions which allow you to return a `Promise` as the result. ```js import { mapAsync } from 'ix/iterable/mapasync'; @@ -342,29 +373,32 @@ The IxJS project has a strict Code of Conduct that must be adhered at all times. Read the [Contributing Guide](CONTRIBUTING.md) on how to get involved with the IxJS project. This includes our development process and how to test your code before committing. ### Packaging + `IxJS` is written in TypeScript, but the project is compiled to multiple JS versions and common module formats. The base IxJS package includes all the compilation targets for convenience, but if you're conscientious about your node_modules footprint, don't worry -- we got you. The targets are also published under the @reactivex namespace: ```sh -npm install @reactivex/ix-es5-cjs # ES5 CommonJS target -npm install @reactivex/ix-es5-esm # ES5 ESModules target -npm install @reactivex/ix-es5-umd # ES5 UMD target -npm install @reactivex/ix-es5-cls # ES5 Google Closure Compiler target -npm install @reactivex/ix-es2015-cjs # ES2015 CommonJS target -npm install @reactivex/ix-es2015-esm # ES2015 ESModules target -npm install @reactivex/ix-es2015-umd # ES2015 UMD target -npm install @reactivex/ix-es2015-cls # ES2015 Google Closure Compiler target -npm install @reactivex/ix-esnext-esm # ESNext CommonJS target -npm install @reactivex/ix-esnext-esm # ESNext ESModules target -npm install @reactivex/ix-esnext-umd # ESNext UMD target -npm install @reactivex/ix-esnext-cls # ESNext Google Closure Compiler target +npm install @reactivex/ix-ts # TypeScript target +npm install @reactivex/ix-es5-cjs # ES5 CommonJS target +npm install @reactivex/ix-es5-esm # ES5 ESModules target +npm install @reactivex/ix-es5-umd # ES5 UMD target +npm install @reactivex/ix-es5-cls # ES5 Google Closure Compiler target +npm install @reactivex/ix-es2015-cjs # ES2015 CommonJS target +npm install @reactivex/ix-es2015-esm # ES2015 ESModules target +npm install @reactivex/ix-es2015-umd # ES2015 UMD target +npm install @reactivex/ix-es2015-cls # ES2015 Google Closure Compiler target +npm install @reactivex/ix-esnext-esm # ESNext CommonJS target +npm install @reactivex/ix-esnext-esm # ESNext ESModules target +npm install @reactivex/ix-esnext-umd # ESNext UMD target +npm install @reactivex/ix-esnext-cls # ESNext Google Closure Compiler target ``` -### Why do we package like this? +### Why we package like this + The JS community is a diverse group with a varied list of target environments and tool chains. Publishing multiple packages accommodates projects of all types. Friends targeting the latest JS runtimes can pull in the ESNext + ESM build. Friends needing wide browser support and small download size can use the UMD bundle, which has been run through Google's Closure Compiler with advanced optimizations. If you think we missed a compilation target and it's a blocker for adoption, please open an issue. We're here for you ❤️. -## License ## +## License The MIT License (MIT)