single-spa - npm Package Compare versions

Comparing version 1.3.0 to 1.3.1

dist/single-spa.js

		@@ -453,14 +453,19 @@ 'use strict';

		function addEventsToAnchors() {
		setTimeout(function () {
		var aTags = document.querySelectorAll('a:not([singlespa])');
		for (var i = 0; i < aTags.length; i++) {
		aTags[i].addEventListener('click', anchorClicked);
		aTags[i].setAttribute('singlespa', '');
		var anchorAddedObserver = new MutationObserver(function (mutations) {
		//my guess is that it is faster just to do one querySelectorAll instead of iterating through the mutations
		var links = document.querySelectorAll('a');
		for (var i = 0; i < links.length; i++) {
		var a = links[i];
		if (!a.singlespa) {
		a.singlespa = true;
		a.addEventListener('click', anchorClicked);
		}
		addEventsToAnchors();
		}, 40);
		}
		}
		});

		addEventsToAnchors();
		anchorAddedObserver.observe(document, {
		subtree: true,
		childList: true,
		characterData: true
		});

		@@ -467,0 +472,0 @@ function anchorClicked(event) {

package.json

		{
		"name": "single-spa",
		"version": "1.3.0",
		"version": "1.3.1",
		"description": "Multiple applications, one page",
		@@ -24,4 +24,4 @@ "main": "dist/single-spa.js",
		"devDependencies": {
		"babel-cli": "6.0.15",
		"babel-preset-es2015": "6.0.15"
		"babel-cli": "6.1.18",
		"babel-preset-es2015": "6.1.18"
		},
		@@ -28,0 +28,0 @@ "ignore": [

README.md

		@@ -23,3 +23,3 @@ # single-spa
		Example:
		```
		```javascript
		// root-app.html
		@@ -50,3 +50,3 @@ <html>
		and then add the following to the jspm app's single-spa.config.js:
		```
		```javascript
		import { defaultJspmApp } from "single-spa-jspm";
		@@ -58,2 +58,4 @@ export const lifecycles = [...(any other plugins)..., defaultJspmApp()]
		So far, webpack has not required any special configuration to work in an SSPA environment. It works out of the box! So no need to add a "lifecycle" for webpack in your single-spa.config.js file.

		One thing to watch out for, though, is to make sure that any urls in your webpack config are relative urls. For example, use `publicPath: 'build/'` instead of `publicPath: '/build/'`
		### Configuring React apps
		@@ -63,3 +65,3 @@ [single-spa-react](https://github.com/joeldenning/single-spa-react) is an actively maintained project that eases the burden of configuring react apps. To use it, run the following in your root app's directory
		and then add the following to your single-spa.config.js:
		```
		```javascript
		import { defaultReactApp } from "single-spa-react";
		@@ -73,2 +75,8 @@
		return document.querySelector('#root-react-element');
		},
		mountApp: function() {
		return ReactDOM.render(<MyApp/>, document.getElementById('root-react-element');
		},
		ReactDOMGetter: function() { //only needed if the ReactDOM object is not leaked as a global
		return window.app.ReactDOM; //or however you want to reference ReactDOM
		}
		@@ -82,3 +90,3 @@ });
		and then add the following to your single-spa.config.js
		```
		```javascript
		import { defaultAngular1App } from "single-spa-angular1";
		@@ -99,3 +107,3 @@
		and then add the following to your single-spa.config.js
		```
		```javascript
		import { appWithGlobals } from "single-spa-globals";
		@@ -106,2 +114,12 @@ export const publicRoot = '....';
		```
		### Configuring React-Router apps
		react-router apps usually require no more configuration than plain old react apps (see above for how to do that). The only thing that may need to change in your app is the `basename` that is used when creating your history object. But that only needs to happen if you're using URLs to determine which app is active at any given time.

		For example, you may have to do something like this:
		```javascript
		import history from "history";
		const history = history.useBasename(history.createHistory)({
		basename: '/path-that-is-active-when-this-app-is-active'
		})
		```
		### Read the examples
		@@ -108,0 +126,0 @@ There is also an [examples repository](https://github.com/joeldenning/single-spa-examples) that shows several apps working great in a single-spa environment. The following files are a good place to start:

src/single-spa.js

		@@ -420,14 +420,19 @@ let appLocationToApp = {};

		function addEventsToAnchors() {
		setTimeout(function() {
		const aTags = document.querySelectorAll('a:not([singlespa])');
		for (let i=0; i<aTags.length; i++) {
		aTags[i].addEventListener('click', anchorClicked);
		aTags[i].setAttribute('singlespa', '');
		const anchorAddedObserver = new MutationObserver(function(mutations) {
		//my guess is that it is faster just to do one querySelectorAll instead of iterating through the mutations
		const links = document.querySelectorAll('a');
		for (let i=0; i<links.length; i++) {
		const a = links[i];
		if (!a.singlespa) {
		a.singlespa = true;
		a.addEventListener('click', anchorClicked);
		}
		addEventsToAnchors();
		}, 40)
		}
		}
		});

		addEventsToAnchors();
		anchorAddedObserver.observe(document, {
		subtree: true,
		childList: true,
		characterData: true,
		});

		@@ -434,0 +439,0 @@ function anchorClicked(event) {

dist/single-spa.js.map

Sorry, the diff of this file is not supported yet

single-spa - npm Package Compare versions

Improved metrics