jmaicher · February 5, 2017 14:32
diff --git a/1.template.html b/1.template.html
 <html>
 <head>
    <!-- ... -->
    <script>
        // stub implementation in case the shell fragment fails to resolve
        define("shell", function() {  return stub;  });
    </script>
 </head>
 <body>
    <fragment src="shell.example.com"></fragment>
    <fragment src="foo.example.com"></fragment>
 </body>
 </html>
diff --git a/2.shell.fragment.html b/2.shell.fragment.html
 <div id="shell">
    <header><!-- ... --></header>
    <aside><!-- ... --></aside>
 </div>

 <script>
 require.undef('shell');
 // Note that the bundle url is dynamically injected from the asset manifest
 define("shell", ["/shell.bundle.js"], function(s) { return s.api });
 </script>
diff --git a/3.shell.entry.js b/3.shell.entry.js
 var api;

 // will be called by tailor on pipe.end
 export default (element) => {
    let view = new ShellView(element);
    api = new ShellApi(view);
 }

 export { api };
diff --git a/4.foo.entry.js b/4.foo.entry.js
 // marked as external in webpack config
 const shell = require('shell');

 // will be called by tailor on pipe.end
 export default (element) => {
    console.log(shell); // => ShellApi
 }
	<html>
	<head>
	<!-- ... -->
	<script>
	// stub implementation in case the shell fragment fails to resolve
	define("shell", function() { return stub; });
	</script>
	</head>
	<body>
	<fragment src="shell.example.com"></fragment>
	<fragment src="foo.example.com"></fragment>
	</body>
	</html>
	<div id="shell">
	<header><!-- ... --></header>
	<aside><!-- ... --></aside>
	</div>

	<script>
	require.undef('shell');
	// Note that the bundle url is dynamically injected from the asset manifest
	define("shell", ["/shell.bundle.js"], function(s) { return s.api });
	</script>
	var api;

	// will be called by tailor on pipe.end
	export default (element) => {
	let view = new ShellView(element);
	api = new ShellApi(view);
	}

	export { api };
	// marked as external in webpack config
	const shell = require('shell');

	// will be called by tailor on pipe.end
	export default (element) => {
	console.log(shell); // => ShellApi
	}