@polylith/builder 0.0.33 → 0.0.36

package/App.js

@@ -6,6 +6,7 @@ import { babel } from '@rollup/plugin-babel';
 import * as resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
 import html from 'rollup-plugin-html';
+import livereload from 'rollup-plugin-livereload';
 
 import loader from './plugin-loader.js';
 import mainHTML from './plugin-main-html.js';
@@ -67,7 +68,9 @@ export default class App {
 		this.configs = {};
 		this.manualChunkType = 'function';
 		this.manualChunks = [];
-		this.files = new Files(this.sourcePath, this.destPath)
+		this.files = new Files(this.sourcePath, this.destPath);
+		this.cssFiles = [];
+		this.liveReload = true;
 	}
 
 	static fileToPath(filename) {
@@ -106,6 +109,9 @@ export default class App {
 		return './' + path;
 	}
 
+	setLiveReload(on) {
+		this.liveReload = on;
+	}
 	setHtmlTemplate(source, destination) {
 		this.htmlTemplate = {source: source, destination: destination};
 	}
@@ -114,6 +120,25 @@ export default class App {
 		this.configs[root] = config;
 	}
 
+	async addMainCss(specs) {
+		var files = new Files(this.sourcePath, this.destPath)
+
+	// get the file paths
+		specs.forEach(function(spec) {
+			files.addCopySpec('', spec);
+		}, this)
+
+		var expanded = await files.findAllFiles();
+		var keys = Object.keys(expanded);
+		keys.forEach(function(key){
+			var file = expanded[key];
+			this.cssFiles.push(file.uri)
+		}, this);
+
+	// now add them to be copied
+		this.addResources('', specs);
+	}
+
 	/**
 	 * Call this method to add a list of resources that will be moved to the
 	 * destination path when the application is built. This will either be a
@@ -124,7 +149,7 @@ export default class App {
 	 * @param {String} root the path to the origin of the caller. Paths in
 	 * 		the spec are assumed to be relative to this.
 	 */
-	addResources(resourceSpecs, root) {
+	addResources(root, resourceSpecs) {
 		resourceSpecs.forEach(function(spec) {
 			this.files.addCopySpec(root, spec);
 		}, this)
@@ -140,7 +165,7 @@ export default class App {
 	 * If present that json will be loaded and used to build the feature.
 	 *
 	 * If that is not found it will look for an index.js file. and if found it
-	 * will add that to the list on feature index files which will be
+	 * will add that to the list of feature index files which will be
 	 * automatically imported when the built code imports the @polylith/features
 	 * module
 	 *
@@ -326,23 +351,37 @@ export default class App {
 	 * 		this loadable. When the loadable has been loaded, the start and
 	 * 		ready methods will be called on all services starting with this
 	 * 		prefix.
+	 * @param {Array<CopySpec>} [css] if supplied it will be a copy spec of the
+	 * 		css files that will included when the module is loaded
 	 */
-	async addLoadable(name, main, prefix, css) {
+	async addLoadable(root, name, main, prefix, css) {
 		// expand css specs
-		var files = new Files(this.sourcePath, this.destPath)
-		resourceSpecs.forEach(function(spec) {
-			files.addCopySpec(root, spec);
-		}, this)
-		var cssUris = [];
-		var expanded = await files.findAllFiles();
-		var keys = Object.keys(expanded);
-		keys.forEach(function(key){
-			var file = expanded[key];
-			cssUris.push(file.uri)
-		}, this)
+		var cssUris = css ? [] : undefined;
+		if (css) {
+			var files = new Files(this.sourcePath, this.destPath)
+			css.forEach(function(spec) {
+				files.addCopySpec(root, spec);
+			}, this)
+			var expanded = await files.findAllFiles();
+			var keys = Object.keys(expanded);
+			keys.forEach(function(key){
+				var file = expanded[key];
+				cssUris.push(file.uri)
+			}, this)
+		}
 
 		var dest = path.posix.join(this.sourcePath, main);
-		this.loadables.push({name, path: dest, prefix});
+		this.loadables.push({name, path: dest, prefix, css: cssUris});
+	}
+
+
+	buildMainCss() {
+		var cssTags = '';
+		this.cssFiles.forEach(function(uri) {
+			cssTags += `		<link rel="stylesheet" href="${uri}"></link>`
+		}, this);
+
+		return cssTags;
 	}
 
 	/**
@@ -354,8 +393,8 @@ export default class App {
 
 	buildConfiguration() {
 		var input = [this.fullIndexPath];
-		this.loadables.forEach(function(path) {
-			input.push(path.path);
+		this.loadables.forEach(function(spec) {
+			input.push(spec.path);
 		});
 
 		this.variables = {
@@ -364,34 +403,42 @@ export default class App {
 		}
 
 		var manualChunks = this.getManualChunks();
+		var mainCss = this.buildMainCss();
+		var plugins = [
+			resolve.nodeResolve({
+				extensions: ['.js', '.jsx']
+			}),
+			commonjs(),
+			babel({
+				presets: ['@babel/preset-react'],
+				babelHelpers: 'bundled',
+			}),
+			loader(this.loadables),
+			features(this.featureIndexes),
+			jsconfig(this.root),
+			html({
+				include: path.join(this.sourcePath, "**/*.html"),
+			}),
+			styles(),
+			mainHTML({
+				root: this.root,
+				source: this.htmlTemplate.source,
+				destination: this.htmlTemplate.destination,
+				replaceVars: {mainCss: mainCss},
+			}),
+			resources(this.name, this.files)
+		];
+
+		if (this.liveReload) {
+			plugins.push(
+				liveReload(this.destPath)
+			)
+		}
 
 		var config = {
 			input : {
 				input: input,
-				plugins: [
-					resolve.nodeResolve({
-						extensions: ['.js', '.jsx']
-					}),
-					commonjs(),
-					babel({
-						presets: ['@babel/preset-react'],
-						babelHelpers: 'bundled',
-					}),
-					loader(this.loadables),
-					features(this.featureIndexes),
-					jsconfig(this.root),
-					html({
-						include: path.join(this.sourcePath, "**/*.html"),
-					}),
-					styles(),
-					mainHTML({
-						root: this.root,
-						source: this.htmlTemplate.source,
-						destination: this.htmlTemplate.destination,
-						replaceVars: {},
-					}),
-					resources(this.name, this.files)
-				],
+				plugins: plugins,
 			},
 			output : {
 				output : {
@@ -458,14 +505,13 @@ export default class App {
 			}
 
 			if (event.code === 'BUNDLE_START') {
-				process.stdout.write("\u001b[2J\u001b[0;0H");
-				console.log(event);
+//				console.log(event);
 			}
 
 			if (event.code === 'BUNDLE_END') {
-				process.stdout.write("\u001b[2J\u001b[0;0H");
-				console.log(event);
+//				console.log(event);
 			}
 		}.bind(this));
 	}
+
 }

package/ConfigFeature.js

@@ -15,21 +15,22 @@ export default class ConfigFeature extends Feature {
 
 	/**
 	 * The application calls the method to build the feature.
-	 * @param {App} app the application for th
+	 *
+	 * @param {App} app the application for the feature
 	 */
 	async build(app) {
 		var config = this.config;
 
 		if (config.loadables && Array.isArray(config.loadables)) {
-			config.loadables.forEach(function(loadable) {
+			for (let loadable of config.loadables){
 				if (loadable.name && loadable.index) {
-					app.addLoadable(loadable.name, path.join(this.root, loadable.index), loadable.prefix, loadable.css);
+					await app.addLoadable(this.root, loadable.name, path.join(this.root, loadable.index), loadable.prefix, loadable.css);
 				}
-			}, this);
+			}
 		}
 
 		if (config.index) app.addFeatureIndex(path.join(this.root, config.index));
 		if (config.config) app.addConfig(config.config, this.root);
-		if (config.resources && Array.isArray(config.resources)) app.addResources(config.resources, this.root);
+		if (config.resources && Array.isArray(config.resources)) app.addResources(this.root, config.resources);
 	}
 }

package/{loaderTemplate.js → loaderTemplate.txt}

@@ -6,7 +6,10 @@ export async function load(name) {
 	if (loaded[name]) return loaded[name]
 	var promise;
 
+	switch (name) {
 {{SWITCHES}}
+	}
 
 	loaded[name] = promise;
+	return promise;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polylith/builder",
-  "version": "0.0.33",
+  "version": "0.0.36",
   "description": "The polylith builder",
   "main": "index.js",
   "type": "module",
@@ -23,6 +23,7 @@
     "rollup": "^2.58.0",
     "rollup-plugin-html": "^0.2.1",
     "rollup-plugin-jsx": "^1.0.3",
+    "rollup-plugin-livereload": "^2.0.5",
     "rollup-plugin-styles": "^4.0.0",
     "sass": "^1.43.4"
   }

package/plugin-jsconfig.js

@@ -83,7 +83,7 @@ async function findPathMatch(base, source, paths) {
 }
 
 
-export default function features(root) {
+export default function jsconfig(root) {
 	var jsConfig;
 	var basePath;
 	var paths;
@@ -111,7 +111,7 @@ export default function features(root) {
 
 
 	return {
-		name: 'features',
+		name: 'jsconfig',
 
 		async resolveId (source, importer, options) {
 			source = fixPath(source);
@@ -125,6 +125,7 @@ export default function features(root) {
 
 			if (basePath) {
 				var tryName = path.join(root, basePath, source);
+				console.log('trying', tryName)
 				if (await fileExists(tryName)) {
 					previouslyMatched[source] = tryName;
 					return tryName;

package/plugin-loader.js

@@ -1,20 +1,12 @@
 import path from 'node:path/posix';
 import {readFile, writeFile, stat} from 'node:fs/promises';
+import {fixPath} from './utils.js';
 var templateSource;
 
-async function fileExists(path) {
-    try {
-        await stat(path)
-        return true;
-    } catch (e) {
-        return false;
-    }
-}
-
 function makeSource(loadables) {
 	var loadableSwitches = '';
 
-	function makeCss() {
+	function makeCss(loadable) {
 		if (!loadable.css) return '';
 		var jsonCss = JSON.stringify(loadable.css);
 		return (
@@ -23,7 +15,7 @@ function makeSource(loadables) {
 
 	}
 
-	function makeServices() {
+	function makeServices(loadable) {
 		if (!loadable.prefix) return '';
 		return (
 `						await registry.start('${loadable.prefix}');`
@@ -32,8 +24,8 @@ function makeSource(loadables) {
 
 	loadables.forEach(function(loadable) {
 		var prefixStr = ';';
-		var cssStr = makeCss();
-		var serviceStr = makeServices();
+		var cssStr = makeCss(loadable);
+		var serviceStr = makeServices(loadable);
 
 		if (loadable.prefix || loadable.css) {
 			prefixStr = `
@@ -44,8 +36,8 @@ ${serviceStr}
 `
 		}
 
-		var switchStr = `
-			case '${loadable.name}':
+		var switchStr =
+`			case '${loadable.name}':
 				promise = import('${loadable.path}')${prefixStr}
 				break;
 `
@@ -54,10 +46,14 @@ ${serviceStr}
 
 	var source = templateSource;
 	var source = source.replace('{{SWITCHES}}', loadableSwitches);
+	var source = source.replace(/\t/g, '    ');
+
+	console.log(source);
 
 	return source;
 }
 
+
 export default function loader(loadables) {
 	return {
 		name: 'loader',
@@ -70,9 +66,12 @@ export default function loader(loadables) {
 		},
 
 		async load (id) {
-			if (templateSource) {
-				templateSource = await readFile('./loaderTemplate.js');
+			var root = path.dirname(fixPath(import.meta.url));
+			if (!templateSource) {
+				templateSource = await readFile(path.join(root, 'loaderTemplate.txt'), 'utf-8');
+				console.log(templateSource);
 			}
+
 			if (id === '@polylith/loader') {
 				return makeSource(loadables);
 			}

package/utils.js

@@ -0,0 +1,20 @@
+import path from 'node:path/posix';
+import {readFile, writeFile, stat} from 'node:fs/promises';
+
+export function fixPath(src) {
+	src = src.replace('file:', '');
+	src = src.replace('///', '');
+	src = src.replace(/.:/, '');
+	src = src.replace(/\\/g, '/');
+
+	return src;
+}
+
+async function fileExists(path) {
+    try {
+        await stat(path)
+        return true;
+    } catch (e) {
+        return false;
+    }
+}