remixin - npm Package Compare versions
Comparing version 1.0.3 to 2.0.0
@@ -0,1 +1,7 @@ | ||
| ## 2.0.0 (2019-08-06) | ||
| - Modernize and transpile Remixin's syntax. | ||
| - Stop including multiple build files in the npm package and version control. | ||
| - Replace the `__DEBUG__` global variable (that is used to toggle some debugging behavior) with a `debug` static property. | ||
| ## 1.0.2 (2016-11-17) | ||
@@ -2,0 +8,0 @@ |
| { | ||
| "name": "remixin", | ||
| "version": "1.0.3", | ||
| "version": "2.0.0", | ||
| "description": "Aspect-oriented, mixin library", | ||
| "main": "index.js", | ||
| "repository": "soundcloud/remixin", | ||
| "author": "SoundCloud", | ||
| "license": "MIT", | ||
| "main": "dist/remixin", | ||
| "files": [ | ||
| "dist" | ||
| ], | ||
| "keywords": [ | ||
@@ -12,22 +18,17 @@ "mixin", | ||
| "scripts": { | ||
| "test-server": "static --cache 0" | ||
| "prepublishOnly": "make" | ||
| }, | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "git://github.com/soundcloud/remixin.git" | ||
| }, | ||
| "author": "SoundCloud", | ||
| "license": "MIT", | ||
| "dependencies": { | ||
| "underscore": "1.8.2" | ||
| "underscore": "^1.9.1" | ||
| }, | ||
| "devDependencies": { | ||
| "eslint": "0.11.0", | ||
| "@babel/cli": "7.4.4", | ||
| "@babel/core": "7.4.5", | ||
| "@babel/plugin-transform-modules-umd": "7.2.0", | ||
| "@babel/preset-env": "7.4.5", | ||
| "@babel/register": "7.4.4", | ||
| "expect.js": "0.3.1", | ||
| "istanbul": "0.3.5", | ||
| "mocha": "2.1.0", | ||
| "mocha-istanbul": "0.2.0", | ||
| "node-static": "0.7.6", | ||
| "uglify-js": "2.4.16" | ||
| "mocha": "5.2.0", | ||
| "nyc": "12.0.2" | ||
| } | ||
| } |
@@ -1,2 +0,2 @@ | ||
| ## Remixin | ||
| ## Remixin [![version][npm badge]][npm] [![build status][travis badge]][travis] | ||
@@ -9,44 +9,23 @@ Remixin is the aspect-oriented mixin library developed and in use at [SoundCloud][soundcloud]. It is inspired by Twitter's [advice.js][advice] and [Joose][joose]. | ||
| npm install remixin | ||
| Install the package via npm: | ||
| ...or clone this repository and use the files in `/dist` as described below. | ||
| ```shell | ||
| npm install remixin | ||
| ``` | ||
| ## Setup | ||
| And then import it: | ||
| Remixin runs in the browser and NodeJS (available as an npm module). It only has one dependency: underscore.js (or lodash). This library is included automatically as a dependency in node, but is not bundled for browser usage, since you likely are already using underscore or lodash in your application anyway. To use Remixin in the browser, it uses dependency injection to get access to underscore: | ||
| ```javascript | ||
| // node.js | ||
| var Mixin = require('remixin'); // ready to go! | ||
| ```js | ||
| import { Mixin } from 'remixin'; | ||
| ``` | ||
| Alternatively, download a browser-ready version from the unpkg CDN: | ||
| ```html | ||
| <!-- used in the browser --> | ||
| <html> | ||
| <script src="underscore.js"></script> | ||
| <script src="remixin-global.js"></script> <!-- creates window.Remixin --> | ||
| <script> | ||
| Mixin = Remixin(_); // pass underscore to the global object and it returns the class ready to go. | ||
| </script> | ||
| <script src="https://unpkg.com/underscore"></script> <!-- creates window._ --> | ||
| <script src="https://unpkg.com/remixin"></script> <!-- creates window.remixin --> | ||
| ``` | ||
| Alternatively, if you're using requirejs, browserify or something similar for browser usage, as long as `require('underscore')` will return something useful, you can use the commonjs version the same as node. | ||
| ([Underscore.js][underscore] is a dependency and needs to be included first.) | ||
| ### Files | ||
| There are 4 files provided in the repository: | ||
| - `remixin-cjs.js` | ||
| - `remixin-global.js` | ||
| - `remixin-dev-cjs.js` | ||
| - `remixin-dev-global.js` | ||
| Files with 'cjs' use CommonJS modules. Remixin is exported on `module.exports` and gets access to underscore via `require('underscore')`. | ||
| Files with 'global' export Remixin as a property on the global object (`window`, in the browser). This needs to be injected with underscore before use, as shown above. | ||
| Files with 'dev' are for development mode: they are not minified, and include error checking. | ||
| Since it's not a real JS library readme if there's not a mention of its footprint, **Remixin is 762 bytes gzipped**. | ||
| ## Usage | ||
@@ -97,18 +76,15 @@ | ||
| If using the development build of Remixin, incorrect use of these modifiers will throw an error. For example, if a | ||
| field declared in `requires` is not found, or trying to apply a `before` on a non-function. The production build skips | ||
| these checks altogether, either failing silently or creating unwanted behaviour when used. For this reason, you should | ||
| definitely use the development version while working. | ||
| Incorrect use of these modifiers will throw an error if `Mixin.debug` is set to `true`. For example, if a field declared in `requires` is not found, or if a `before` is applied on a non-function. By default, `Mixin.debug` is `false`. | ||
| ### Custom `applyTo` | ||
| If custom code is required for your mixin, then defining a key named 'applyTo' allows a custom method to be executed | ||
| If custom code is required for your mixin, then defining a key named `applyTo` allows a custom method to be executed | ||
| when the mixin is applied. This method is passed two arguments: the target object and any options defined by the | ||
| calling code: | ||
| ```javascript | ||
| ```js | ||
| zoomable = new Mixin({ | ||
| applyTo: function (obj, options) { | ||
| applyTo(obj, options) { | ||
| this.extend(obj, { | ||
| zoom: function () { | ||
| zoom() { | ||
| this.width *= options.zoomRatio; | ||
@@ -144,3 +120,3 @@ this.height *= options.zoomRatio; | ||
| ```javascript | ||
| ```js | ||
| overlay = new Mixin({ | ||
@@ -152,5 +128,5 @@ merge: { | ||
| }, | ||
| show: function () { ... }, | ||
| hide: function () { ... }, | ||
| onCloseClick: function () { | ||
| show() { ... }, | ||
| hide() { ... }, | ||
| onCloseClick() { | ||
| this.hide(); | ||
@@ -162,3 +138,3 @@ } | ||
| after: { | ||
| onCloseClick: function () { | ||
| onCloseClick() { | ||
| this.parentButton.focus(); | ||
@@ -175,3 +151,3 @@ } | ||
| ```javascript | ||
| ```js | ||
| megaMixin = new Mixin(mixin1, mixin2, mixin3, mixin4, {}); | ||
@@ -182,3 +158,3 @@ ``` | ||
| To create the builds: | ||
| To build the source: | ||
@@ -189,3 +165,3 @@ ```shell | ||
| To run the tests in node: | ||
| To run the tests: | ||
@@ -196,10 +172,2 @@ ```shell | ||
| To run the tests in your browser: | ||
| ```shell | ||
| npm run test-server | ||
| ``` | ||
| ...and then open your browser to http://127.0.0.1:8080/test.html | ||
| To see a coverage report: | ||
@@ -211,2 +179,6 @@ | ||
| [npm]: https://www.npmjs.org/package/remixin | ||
| [npm badge]: https://img.shields.io/npm/v/remixin.svg | ||
| [travis]: https://travis-ci.org/soundcloud/remixin | ||
| [travis badge]: https://img.shields.io/travis/soundcloud/remixin.svg | ||
| [advice]: https://github.com/flightjs/flight/blob/master/lib/advice.js | ||
@@ -217,1 +189,2 @@ [blog]: https://javascriptweblog.wordpress.com/2011/05/31/a-fresh-look-at-javascript-mixins/ | ||
| [soundcloud]: https://soundcloud.com | ||
| [underscore]: https://underscorejs.org |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
No repository
Supply chain riskPackage does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Improved metrics
- Number of low quality alerts
- decreased by-50%
1
Worsened metrics
- Total package byte prevSize
- decreased by-68.25%
20931
- Dev dependency count
- increased by14.29%
8
- Number of package files
- decreased by-68.75%
5
- Lines of code
- decreased by-81.09%
278
- Number of lines in readme file
- decreased by-13.04%
180
- Number of low supply chain risk alerts
- increased byInfinity%
1
- Number of medium supply chain risk alerts
- increased by100%
2
Dependency changes
+ Addedunderscore@1.13.7(transitive)
- Removedunderscore@1.8.2(transitive)
Updatedunderscore@^1.9.1