vue-script2 - npm Package Compare versions

Comparing version 2.0.1 to 2.0.2

dist/vue-script2.js

 /*!
-  * vue-script2 v2.0.1
-  * (c) 2016-2017 Greg Slepak
+  * vue-script2 v2.0.2
+  * (c) 2016-2018 Greg Slepak
   * @license MIT License
@@ -10,3 +10,3 @@ */
   (global.VueScript2 = factory());
-}(this, function () { 'use strict';
+}(this, (function () { 'use strict';
 
@@ -16,6 +16,5 @@ var Script2 = {
     p: Promise.resolve(),
-    version: '2.0.1', // grunt will overwrite to match package.json
+    version: '2.0.2', // grunt will overwrite to match package.json
     loaded: {}, // keys are the scripts that have been loaded
     install: function install(Vue) {
-      var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
 
@@ -32,5 +31,7 @@ if (Script2.installed) return;
         // <slot> is important, see: http://vuejs.org/guide/components.html#Named-Slots
-        template: '<div style="display:none"><slot></slot></div>',
-        // NOTE: I tried doing this with Vue 2's new render() function.
-        //       It was a nightmare and I never got it to work.
+        // template: '<div style="display:none"><slot></slot></div>',
+        // NOTE: Instead of using `template` we can use the `render` function like so:
+        render: function render(h) {
+          return h('div', { style: 'display:none' }, this.$slots.default);
+        },
         mounted: function mounted() {
@@ -60,3 +61,5 @@ var _this = this;
             // code that assumes this.$el is in-document
-            _this.$el.remove(); // remove dummy template <div>
+            // NOTE: we could've done this.$el.remove(), but IE sucks, see:
+            //       https://github.com/taoeffect/vue-script2/pull/17
+            _this.$el.parentElement.removeChild(_this.$el); // remove dummy template <div>
           });
@@ -74,3 +77,3 @@ },
     load: function load(src) {
-      var opts = arguments.length <= 1 || arguments[1] === undefined ? { parent: document.head } : arguments[1];
+      var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { parent: document.head };
 
@@ -114,3 +117,3 @@ return Script2.loaded[src] ? Promise.resolve(src) : new Promise(function (resolve, reject) {
       props.forEach(function (k) {
-        return x[k] = o[k];
+        x[k] = o[k];
       });
@@ -150,2 +153,2 @@ return x;
 
-}));
+})));

dist/vue-script2.min.js

 /*!
-  * vue-script2 v2.0.1
-  * (c) 2016-2017 Greg Slepak
+  * vue-script2 v2.0.2
+  * (c) 2016-2018 Greg Slepak
   * @license MIT License
   */
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.VueScript2=n()}(this,function(){"use strict";var e={installed:!1,p:Promise.resolve(),version:"2.0.1",loaded:{},install:function(t){arguments.length<=1||void 0===arguments[1]?{}:arguments[1];if(!e.installed){var i=["unload"],o=i.concat(["src","type","async","integrity","text","crossorigin"]);t.component("script2",{props:o,template:'<div style="display:none"><slot></slot></div>',mounted:function(){var t=this,i=this.$el.parentElement;if(this.src){var r=n.omitBy(n.pick(this,o),n.isUndefined);r.parent=i;var c=function(){return e.load(t.src,r)};n.isUndefined(this.async)?e.p=e.p.then(c):c()}else e.p=e.p.then(function(){var e=document.createElement("script");e.type="text/javascript",e.appendChild(document.createTextNode(t.$el.innerHTML)),i.appendChild(e)});this.$nextTick(function(){t.$el.remove()})},destroyed:function(){this.unload&&(new Function(this.unload)(),delete e.loaded[this.src])}}),e.installed=!0}},load:function(t){var i=arguments.length<=1||void 0===arguments[1]?{parent:document.head}:arguments[1];return e.loaded[t]?Promise.resolve(t):new Promise(function(o,r){var c=document.createElement("script");n.defaults2(c,n.omit(i,["unload","parent"]),{type:"text/javascript"}),c.async=!1,c.src=t,i.crossorigin&&(c.crossOrigin=i.crossorigin),c.onload=function(){e.loaded[t]=1,o(t)},c.onerror=function(){return r(new Error(t))},i.parent.appendChild(c)})}},n={isUndefined:function(e){return void 0===e},pick:function(e,n){var t={};return n.forEach(function(n){return t[n]=e[n]}),t},omit:function(e,n){var t={};return Object.keys(e).forEach(function(i){-1===n.indexOf(i)&&(t[i]=e[i])}),t},omitBy:function(e,n){var t={};return Object.keys(e).forEach(function(i){n(e[i])||(t[i]=e[i])}),t},defaults2:function(e){for(var t=arguments.length,i=Array(t>1?t-1:0),o=1;t>o;o++)i[o-1]=arguments[o];i.forEach(function(t){Object.keys(t).forEach(function(i){(n.isUndefined(e[i])||""===e[i])&&(e[i]=t[i])})})}};return e});
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.VueScript2=n()}(this,function(){"use strict";var e={installed:!1,p:Promise.resolve(),version:"2.0.2",loaded:{},install:function(t){if(!e.installed){var i=["unload"].concat(["src","type","async","integrity","text","crossorigin"]);t.component("script2",{props:i,render:function(e){return e("div",{style:"display:none"},this.$slots.default)},mounted:function(){var t=this,r=this.$el.parentElement;if(this.src){var o=n.omitBy(n.pick(this,i),n.isUndefined);o.parent=r;var c=function(){return e.load(t.src,o)};n.isUndefined(this.async)?e.p=e.p.then(c):c()}else e.p=e.p.then(function(){var e=document.createElement("script");e.type="text/javascript",e.appendChild(document.createTextNode(t.$el.innerHTML)),r.appendChild(e)});this.$nextTick(function(){t.$el.parentElement.removeChild(t.$el)})},destroyed:function(){this.unload&&(new Function(this.unload)(),delete e.loaded[this.src])}}),e.installed=!0}},load:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{parent:document.head};return e.loaded[t]?Promise.resolve(t):new Promise(function(r,o){var c=document.createElement("script");n.defaults2(c,n.omit(i,["unload","parent"]),{type:"text/javascript"}),c.async=!1,c.src=t,i.crossorigin&&(c.crossOrigin=i.crossorigin),c.onload=function(){e.loaded[t]=1,r(t)},c.onerror=function(){return o(new Error(t))},i.parent.appendChild(c)})}},n={isUndefined:function(e){return void 0===e},pick:function(e,n){var t={};return n.forEach(function(n){t[n]=e[n]}),t},omit:function(e,n){var t={};return Object.keys(e).forEach(function(i){-1===n.indexOf(i)&&(t[i]=e[i])}),t},omitBy:function(e,n){var t={};return Object.keys(e).forEach(function(i){n(e[i])||(t[i]=e[i])}),t},defaults2:function(e){for(var t=arguments.length,i=Array(t>1?t-1:0),r=1;r<t;r++)i[r-1]=arguments[r];i.forEach(function(t){Object.keys(t).forEach(function(i){(n.isUndefined(e[i])||""===e[i])&&(e[i]=t[i])})})}};return e});

Gruntfile.js

@@ -1,4 +0,5 @@
-var babel = require('rollup-plugin-babel')
-var uglify = require('rollup-plugin-uglify')
-var fs = require('fs')
+const rollup = require('rollup')
+const babel = require('rollup-plugin-babel')
+const uglify = require('rollup-plugin-uglify')
+const fs = require('fs')
 
@@ -11,3 +12,3 @@ module.exports = function (grunt) {
   var main = fs.readFileSync(file, 'utf-8')
-  var v1 = main.match(/version: '([\d\.]+)'/)[1]
+  var v1 = main.match(/version: '([\d.]+)'/)[1]
   if (v1 !== pkg.version) {
@@ -27,15 +28,8 @@ console.log(`Updating version in ${file}: ${v1} => ${pkg.version}`)
 
-  function merge (o, s) {
+  function pick (o, props) {
     var x = {}
-    Object.keys(o).forEach((k) => x[k] = s[k] ? s[k] : o[k])
+    props.forEach(k => { x[k] = o[k] })
     return x
   }
 
-  var opts = {
-    format: 'umd',
-    moduleName: camelCase(pkg.name),
-    plugins: [babel({presets: ['es2015-rollup']})],
-    banner: banner
-  }
-
   grunt.initConfig({
@@ -46,10 +40,22 @@ pkg: pkg,
       umd: {
-        options: opts,
-        files: { 'dist/<%= pkg.name %>.js': ['src/index.js'] }
+        input: 'src/index.js',
+        plugins: [babel({exclude: './node_modules/**'})],
+        output: {
+          file: `dist/${pkg.name}.js`,
+          format: 'umd',
+          name: camelCase(pkg.name),
+          banner
+        }
       },
       ugly: {
-        options: merge(opts, {plugins: [...opts.plugins, uglify({
-          output: {preamble: banner}
-        })]}),
-        files: { 'dist/<%= pkg.name %>.min.js': ['src/index.js'] }
+        input: 'src/index.js',
+        plugins: [
+          babel({exclude: './node_modules/**'}),
+          uglify({output: {preamble: banner}})
+        ],
+        output: {
+          file: `dist/${pkg.name}.min.js`,
+          format: 'umd',
+          name: camelCase(pkg.name)
+        }
       }
@@ -59,2 +65,12 @@ },
   })
+
+  grunt.registerMultiTask('rollup', async function () {
+    // grunt.log.writeln(this.target + ': ', this.data)
+    var done = this.async()
+    // https://rollupjs.org/guide/en#javascript-api
+    const bundle = await rollup.rollup(pick(this.data, ['input', 'plugins']))
+    await bundle.write(this.data.output)
+    done()
+  })
+
   grunt.registerTask('default', ['standard', 'rollup'])
@@ -64,3 +80,3 @@ }
 function camelCase (s) {
-  return s.replace(/(?:^|[-_\/])(\w)/g, (_, c) => c ? c.toUpperCase() : '')
+  return s.replace(/(?:^|[-_/])(\w)/g, (_, c) => c ? c.toUpperCase() : '')
 }

package.json

 {
   "name": "vue-script2",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "Brings back <script> to your favorite Single Page App!",
@@ -41,13 +41,14 @@ "main": "dist/vue-script2.js",
   "devDependencies": {
-    "babel-core": "6.8.0",
-    "babel-eslint": "6.0.4",
-    "babel-preset-es2015-rollup": "1.1.1",
-    "grunt": "1.0.1",
-    "grunt-check-dependencies": "0.12.0",
-    "grunt-rollup": "0.7.1",
-    "grunt-standard": "2.0.0",
-    "load-grunt-tasks": "3.5.0",
-    "rollup-plugin-babel": "2.4.0",
-    "rollup-plugin-uglify": "0.3.1"
+    "babel-core": "6.26.3",
+    "babel-eslint": "8.2.3",
+    "babel-plugin-external-helpers": "6.22.0",
+    "babel-preset-env": "1.7.0",
+    "grunt": "1.0.2",
+    "grunt-check-dependencies": "1.0.0",
+    "grunt-standard": "3.1.0",
+    "load-grunt-tasks": "4.0.0",
+    "rollup": "0.58.2",
+    "rollup-plugin-babel": "3.0.4",
+    "rollup-plugin-uglify": "3.0.0"
   }
 }

README.md

@@ -19,3 +19,3 @@ # VueScript2 - Simple, Familiar Asynchronous Script Loading
 - Easy for web designers to pick up! If you know HTML, you already know how to use it!
-- Tiny! Only __1kb__! (min+gzip'd)
+- Tiny! Less than __1kb__! (min+gzip'd)
 - Perfect for use in `.ejs` templates or `.html` files!
@@ -39,2 +39,11 @@ - No more including every library on every page or complicated "code splitting"!
 
+Or with `import`:
+
+```js
+import Vue from 'vue'
+import VS2 from 'vue-script2'
+
+Vue.use(VS2)
+```
+
 ## Usage
@@ -134,17 +143,5 @@
 
-### TODO
-
-- [ ] Add tests + Travis CI. Not much to test though.
-
 ## History
 
-- __2.0.1__ - `crossorigin` Safari fix (thanks [@mingchuno](https://github.com/mingchuno)!)
-- __2.0.0__ - Vue 2.x compatible. Requires Vue 2.x. Use 1.2.2 for Vue 1.x.
-- __1.2.2__ - Fixes broken `crossorigin` attribute (thx @grempe!)
-- __1.2.1__ - Just a bit of perfectionism to fix a non-issue issue
-- __1.2.0__ - Added `VueScript2.load` imperative loading
-- __1.1.2__ - Another bump to get npm.org to display `script2ify` in the README
-- __1.1.1__ - Identical to `1.1.0`, just adds needed package.json info.
-- __1.1.0__ - Adds special support for `async` attribute.
-- __1.0.0__ - Initial release.
+See [`CHANGELOG.md`](CHANGELOG.md)
 
@@ -151,0 +148,0 @@ # License

src/index.js

 var Script2 = {
   installed: false,
   p: Promise.resolve(),
-  version: '2.0.1', // grunt will overwrite to match package.json
+  version: '2.0.2', // grunt will overwrite to match package.json
   loaded: {}, // keys are the scripts that have been loaded
@@ -17,5 +17,5 @@ install (Vue, options = {}) {
       // <slot> is important, see: http://vuejs.org/guide/components.html#Named-Slots
-      template: '<div style="display:none"><slot></slot></div>',
-      // NOTE: I tried doing this with Vue 2's new render() function.
-      //       It was a nightmare and I never got it to work.
+      // template: '<div style="display:none"><slot></slot></div>',
+      // NOTE: Instead of using `template` we can use the `render` function like so:
+      render (h) { return h('div', {style: 'display:none'}, this.$slots.default) },
       mounted () {
@@ -42,3 +42,5 @@ var parent = this.$el.parentElement
           // code that assumes this.$el is in-document
-          this.$el.remove() // remove dummy template <div>
+          // NOTE: we could've done this.$el.remove(), but IE sucks, see:
+          //       https://github.com/taoeffect/vue-script2/pull/17
+          this.$el.parentElement.removeChild(this.$el) // remove dummy template <div>
         })
@@ -87,3 +89,3 @@ },
     var x = {}
-    props.forEach((k) => x[k] = o[k])
+    props.forEach(k => { x[k] = o[k] })
     return x
@@ -90,0 +92,0 @@ },

No alert changes

Improved metrics

Total package byte prevSize

22795

increased by6.51%

Number of package files

8

increased by14.29%

Lines of code

328

increased by9.7%

Worsened metrics

Dev dependency count

11

increased by10%

Number of lines in readme file

148

decreased by-1.99%

No dependency changes