http-vue-loader - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

package.json

 {
   "name": "http-vue-loader",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Load .vue files directly from your html/js. No node.js environment, no build step.",
@@ -5,0 +5,0 @@ "main": "./src/httpVueLoader.js",

README.md

@@ -83,2 +83,7 @@ # http-vue-loader
 
+## Features
+* `http-vue-loader` only supports text/x-template for `<template>`, text/javascript for `<script>` and text/css for `<style>`.
+* `<template>`, `<script>` and `<style>` support the `src` attribute.
+* `<style scoped>` is supported.
+* `module.exports` may be a promise.
 
@@ -95,3 +100,3 @@
 * [Vue.js 2](https://vuejs.org/) ([compiler and runtime](https://vuejs.org/v2/guide/installation.html#Explanation-of-Different-Builds))
-* [es6-promise](https://github.com/stefanpenner/es6-promise) (optional, except for IE, Chrome < 33, FireFox < 29, [see other](http://caniuse.com/#search=promise) )
+* [es6-promise](https://github.com/stefanpenner/es6-promise) (optional, except for IE, Chrome < 33, FireFox < 29, [...](http://caniuse.com/#search=promise) )
 
@@ -146,6 +151,4 @@
 However, for production, I recommend to use [webpack module bundler](https://webpack.github.io/docs/) with [vue-loader](https://github.com/vuejs/vue-loader), 
-see also [why Vue.js doesn't support templateURL](https://vuejs.org/2015/10/28/why-no-template-url/).  
-Note also that `http-vue-loader` only supports text/x-template for `<template>`, text/javascript for `<script>` and text/css for `<style>`.  
- `<template>`, `<script>` and `<style>` does not support the `src` attribute yet.  
- `<style scoped>` is functional.  
+[webpack-simple](https://github.com/vuejs-templates/webpack-simple) is a good minimalist webpack config you should look at.  
+BTW, see also [why Vue.js doesn't support templateURL](https://vuejs.org/2015/10/28/why-no-template-url/).  
 
@@ -152,0 +155,0 @@

src/httpVueLoader.js

@@ -72,3 +72,16 @@ 'use strict';
 	}
+	
+	function normalizeContent(elt) {
+		
+		if ( elt === null || !elt.hasAttribute('src') )
+			return Promise.resolve();
 
+		return httpVueLoader.httpRequest(elt.getAttribute('src'))
+		.then(function(content) {
+
+			elt.removeAttribute('src');
+			elt.innerHTML = content;
+		});
+	}
+
 	return function(resolve, reject) {
@@ -84,3 +97,2 @@
 			
-			var module = { exports:{} };
 			var templateElt = null;
@@ -110,78 +122,88 @@ var scriptElt = null;
 
-			if ( scriptElt !== null ) {
 
-				try {
-					Function('module', 'require', scriptElt.textContent)(module, require);
-				} catch(ex) {
-					
-					if ( !('lineNumber' in ex) ) {
+			return Promise.all(Array.prototype.concat(
+				normalizeContent(templateElt), 
+				normalizeContent(scriptElt), 
+				styleElts.map(function(item) { return normalizeContent(item) })
+			))
+			.then(function() {
+				
+				var module = { exports:{} };
+
+				if ( scriptElt !== null ) {
+
+					try {
+						Function('module', 'require', scriptElt.textContent)(module, require);
+					} catch(ex) {
 						
-						reject(ex);
-						return
+						if ( !('lineNumber' in ex) ) {
+							
+							reject(ex);
+							return
+						}
+						var vueFileData = responseText.replace(/\r?\n/g, '\n');
+						var lineNumber = vueFileData.substr(0, vueFileData.indexOf(scriptElt.textContent)).split('\n').length + ex.lineNumber - 1;
+						throw new (ex.constructor)(ex.message, url, lineNumber);
 					}
-					var vueFileData = responseText.replace(/\r?\n/g, '\n');
-					var lineNumber = vueFileData.substr(0, vueFileData.indexOf(scriptElt.textContent)).split('\n').length + ex.lineNumber - 1;
-					throw new (ex.constructor)(ex.message, url, lineNumber);
+				
 				}
 				
-			}
-			
-			return Promise.resolve(module.exports)
-			.then(function(exports) {
-				
-				var headElt = document.head || document.getElementsByTagName('head')[0];
-
-				if ( baseURI ) {
+				return Promise.resolve(module.exports)
+				.then(function(exports) {
 					
-					// firefox and chrome need the <base> to be set while inserting the <style> in the document
-					var tmpBaseElt = document.createElement('base');
-					tmpBaseElt.href = baseURI;
-					headElt.insertBefore(tmpBaseElt, headElt.firstChild);
-				}
+					var headElt = document.head || document.getElementsByTagName('head')[0];
 
-				var scopeId = '';
-				function getScopeId(templateRootElement) {
-					
-					if ( scopeId === '' ) {
+					if ( baseURI ) {
 						
-						scopeId = 'data-s-' + (httpVueLoader.scopeIndex++).toString(36);
-						(templateElt.content || templateElt).firstElementChild.setAttribute(scopeId, '');
+						// firefox and chrome need the <base> to be set while inserting the <style> in the document
+						var tmpBaseElt = document.createElement('base');
+						tmpBaseElt.href = baseURI;
+						headElt.insertBefore(tmpBaseElt, headElt.firstChild);
 					}
-					return scopeId;
-				}
 
-				for ( var i = 0; i < styleElts.length; ++i ) {
+					var scopeId = '';
+					function getScopeId(templateRootElement) {
+						
+						if ( scopeId === '' ) {
+							
+							scopeId = 'data-s-' + (httpVueLoader.scopeIndex++).toString(36);
+							(templateElt.content || templateElt).firstElementChild.setAttribute(scopeId, '');
+						}
+						return scopeId;
+					}
 
-					var style = styleElts[i];
-					var scoped = style.hasAttribute('scoped');
+					for ( var i = 0; i < styleElts.length; ++i ) {
 
-					if ( scoped ) {
+						var style = styleElts[i];
+						var scoped = style.hasAttribute('scoped');
+
+						if ( scoped ) {
+							
+							// no template, no scopable style
+							if ( templateElt === null )
+								continue;
+							
+							// firefox does not tolerate this attribute
+							style.removeAttribute('scoped');
+						}
 						
-						// no template, no scopable style
-						if ( templateElt === null )
-							continue;
+						headElt.appendChild(style);
 						
-						// firefox does not tolerate this attribute
-						style.removeAttribute('scoped');
+						if ( scoped )
+							httpVueLoader.scopeStyles(style, '['+getScopeId()+']');
 					}
 					
-					headElt.appendChild(style);
+					if ( baseURI )
+						headElt.removeChild(tmpBaseElt);
 					
-					if ( scoped )
-						httpVueLoader.scopeStyles(style, '['+getScopeId()+']');
-				}
-				
-				if ( baseURI )
-					headElt.removeChild(tmpBaseElt);
-				
-				if ( templateElt !== null )
-					exports.template = templateElt.innerHTML;
+					if ( templateElt !== null )
+						exports.template = templateElt.innerHTML;
 
-				if ( exports.name === undefined )
-					if ( name !== undefined )
-						exports.name = name;
-				
-				return exports;
+					if ( exports.name === undefined )
+						if ( name !== undefined )
+							exports.name = name;
+					
+					return exports;
+				});				
 			});
-
 		})
@@ -241,4 +263,4 @@ .then(resolve, reject);
 		else
-    		reject(xhr.status, xhr.statusText);
+    		reject(xhr.status);
 	});
 }

No alert changes

Improved metrics

Total package byte prevSize

12751

increased by10.4%

Lines of code

183

increased by9.58%

Number of lines in readme file

161

increased by1.9%

No dependency changes