Revamp Build Infra for tiny-lru #27

osdevisnot · 2019-09-26T23:35:47Z

I feel like this PR might be controversial as its attempting to change lot of things. But I will try to present this as best as I can.

I started looking at tiny-lru as it is a dependency of graphql-hooks-memcache while investigating #366. It seems graphql-hooks-memcache is trying to use tiny-lru as es6 dependency, and es6 exports from tiny-lru isn't exactly consumable.

Incidentally, I recently started working on tslib-cli which attempts to streamline tooling/setup required for publishing libraries to NPM. In short, it provides:

OcJS - Rollup + Jest + Typescript + TSLint + Prettier
Best Practices setup for build, format, lint and publish workflows
Save Hours setting up tooling to release a library to NPM.

With these in mind, I started porting tiny-lru to use tslib-cli for build tooling. This PR presents the list of changes needed for such port.

Looking into it more, we can even extend this PR to auto generate type definitions, which will need us to port code from js to ts. It might also need some work on eslint to tslint migration if we decide to port code to ts.

NB: I will use comments on diff to explain some of the changes in this PR as this description is getting rather long.

Thanks in advance for looking into this ❤️

Output of npm pack after these changes:

output file sizes after these changes:

osdevisnot · 2019-09-26T23:36:36Z

.gitignore

-.idea/*
+node_modules
+.idea
+*.tgz


ignore the removal of star, this mainly adds tgz to ignore list.

osdevisnot · 2019-09-26T23:39:06Z

.npmignore

-.travis.yml
-Gruntfile.js
-benchmark.js
-bower.json


It's better to use whitelist as opposed to maintaining whitelist to ignore files during publish. See https://gist.github.com/ceejbot/610773f9990a751db68dc6c66974b8ec#whitelisting-files-with-the-files-array

This doesn't work well IRL, as it'll include a CHANGELOG if present

nm, it's always included 👍

osdevisnot · 2019-09-26T23:41:28Z

Gruntfile.js

-	grunt.registerTask("test", ["eslint", "nodeunit"]);
-	grunt.registerTask("build", ["copy", "concat"]);
-	grunt.registerTask("default", ["build", "test", "babili"]);
-};


This is little opinionated. grunt works fine here, but I feel like it's a lot of config work for such a small library. I mean when the grunt file is larger than the code, we should probably avoid it.

osdevisnot · 2019-09-26T23:43:16Z

lib/tiny-lru.d.ts

-    public keys(): string[];
-  }
-  export default Lru;
-}


it seems this was just copied from root to lib, which looks un-necessary. The type file at root works perfectly too if package.json has types key.

osdevisnot · 2019-09-26T23:46:09Z

src/intro.js

@@ -1,3 +0,0 @@
-"use strict";
-
-(function (global) {


this file is not needed anymore.

osdevisnot · 2019-09-26T23:46:45Z

src/outro.js

-	} else {
-		global.lru = factory;
-	}
-}(typeof window !== "undefined" ? window : global));


this file is not needed anymore. the factory function is included in main file src/lru.js

osdevisnot · 2019-09-26T23:47:09Z

tsconfig.json

+		"allowJs": true,
+		"sourceMap": true
+	}
+}


a minimal typescript configuration file

osdevisnot · 2019-09-26T23:48:05Z

src/lru.js

+		}
+
+		return new LRU(max, ttl);
+	}


this was moved here from src/outro.js

osdevisnot · 2019-09-26T23:48:53Z

package.json

-    "grunt-contrib-copy": "^1.0.0",
-    "grunt-contrib-nodeunit": "^2.0.0",
-    "grunt-contrib-watch": "^1.1.0",
-    "grunt-eslint": "^22.0.0",


remove all babel and grunt related dependencies.
add nodeunit and tslib-cli as dependencies.

osdevisnot · 2019-09-26T23:55:21Z

package.json

+  "browser": "lib/tiny-lru.js",
+  "main": "lib/tiny-lru.cjs.js",
+  "module": "lib/tiny-lru.esm.js",
+  "types": "tiny-lru.d.ts",


so essentially

we want nodejs code main property to read lib/tiny-lru.cjs.js which was lib/tiny-lru.js before.

we are changing types to just point at file at root and avoid copy to lib.

we are also renaming module entry point from lib/tiny-lru.es6.js to lib/tiny-lru.esm.js -- This is to avoid versioning confusion in future. Releasing es2020 code for example won't need to change this file again in future.

we are introducing a new browser property to publish our modules as umd -- read here about browser property

we are also removing un-minified version (we minify by default). I am planning to release a new version of tslib-cli which will start producing sourcemaps too, which is not available for now.

avoidwork · 2019-09-27T01:38:44Z

Looks good to me.

avoidwork · 2019-09-27T01:43:23Z

What would you categorize this as? major or minor semver change? i'm thinking minor.

osdevisnot · 2019-09-27T01:59:05Z

Considering that we are changing output file names, it might impact someone relying on file paths for imports. Specifically the who were following previous webpack usage guidelines in readme.

That said I would consider this as a major version

avoidwork · 2019-09-27T02:02:30Z

👍

avoidwork · 2019-09-27T02:26:25Z

I'm totally gonna copy/pasta this around some of my other repos.

osdevisnot · 2019-09-27T02:54:05Z

I'm totally gonna copy/pasta this around some of my other repos.

I have WIP docs here: https://tslib-cli.js.org/ in case you need to refer back. Feel free to let me know if you ever need details on specific parts of tslib-cli

osdevisnot added 7 commits September 26, 2019 16:14

remove extraneous files from lib

d35c2cb

remove slash stars form ignore files

7ae2bf7

remove npmignore, see 'files' in package.json for whitelist

ca96e77

ignore outout of npm pack

50f969a

add minimal tsconfig needed for tslib-cli

6df99b8

start using new build tool

fc614a3

add default export from outro to main file

32da32a