vue3-sfc-loader - npm Package Compare versions

Comparing version 0.2.16 to 0.2.17

build/evalHtmlComments.js

@@ -20,6 +20,6 @@ const fs = require('fs');
 const fctList = scriptList
-.map(code => (ctx, global) => (function(global) { return eval(code) }).call(ctx, global) );
+.map(code => ctx => (function(ctx) { return eval(code) }).call(null, ctx) );
 
 for ( const fct of fctList )
-	result = fct(result, global);
+	result = fct({ wholeContent: result, global });
 
@@ -51,3 +51,3 @@ result = result.replace(regexp, function(all, p1) {
 |   const versionObj = require('semver').parse(require(process.cwd() + '/package.json').version);
-|   this.replace(/(\/vue3-sfc-loader@)(.*?)(\/)/g, `$1^${ versionObj.major }.${ versionObj.minor }$3`);
+|   ctx.wholeContent.replace(/(\/vue3-sfc-loader@)(.*?)(\/)/g, `$1^${ versionObj.major }.${ versionObj.minor }$3`);
 | 
@@ -54,0 +54,0 @@ | -->

build/webpack.config.js

@@ -25,10 +25,10 @@ const Path = require('path');
 		targetsBrowsers = 'defaults',
-		noPresetEnv = false,
-		noCompress = false,
+		noPresetEnv = !isProd,
+		noCompress = !isProd,
 	} = env;
 
-	console.log('env', env);
-
 	const genSourcemap = false;
 
+	console.log('config', { targetsBrowsers, noPresetEnv, noCompress, genSourcemap });
+
 	return {
@@ -49,3 +49,3 @@ entry: [
 				// doc: https://webpack.js.org/configuration/output/#outputenvironment
-				...isProd ? {
+				...!noPresetEnv ? {
 					arrowFunction: caniuse.isSupported('arrow-functions', targetsBrowsers),
@@ -99,3 +99,3 @@ const: caniuse.isSupported('const', targetsBrowsers),
 			// minimize
-			...(isProd && !noCompress) ? [
+			...!noCompress ? [
 				new TerserPlugin({
@@ -109,4 +109,6 @@ extractComments: false,
 							drop_console: true,
-							arrows: caniuse.isSupported('arrow-functions', targetsBrowsers),
-							ecma: caniuse.isSupported('es6', targetsBrowsers) ? '2015' : '5', // note ECMAScript 2015 is the sixth edition of the ECMAScript Language Specification standard
+							...!noPresetEnv ? {
+								arrows: caniuse.isSupported('arrow-functions', targetsBrowsers),
+								ecma: caniuse.isSupported('es6', targetsBrowsers) ? '2015' : '5', // note ECMAScript 2015 is the sixth edition of the ECMAScript Language Specification standard
+							} : {},
 						},
@@ -113,0 +115,0 @@ },

CHANGELOG.md

 
+### [0.2.17](https://github.com/FranckFreiburger/vue3-sfc-loader/compare/v0.2.16...v0.2.17) (2020-12-08)
+
+
+### Features
+
+* **core:** enhance moduleCache management ([4ab1dbd](https://github.com/FranckFreiburger/vue3-sfc-loader/commit/4ab1dbda918276a0d7f7d2784537d5cc5f6e360f))
+
+
+### Bug Fixes
+
+* **core:** call addStyle() with scopeId only if style is scoped ([cd10f83](https://github.com/FranckFreiburger/vue3-sfc-loader/commit/cd10f8344a0dcd3ba6a44733c5feb3e45bc3671b))
+* **core:** fix import() path resolution ([33af5e9](https://github.com/FranckFreiburger/vue3-sfc-loader/commit/33af5e96a68ce077a1de80222a042b48247323c4))
+* **core:** fix module cache handling ([80907a4](https://github.com/FranckFreiburger/vue3-sfc-loader/commit/80907a40d68759db35d9af3696828c47444e4dc6))
+
 ### [0.2.16](https://github.com/FranckFreiburger/vue3-sfc-loader/compare/v0.2.15...v0.2.16) (2020-12-07)
@@ -3,0 +17,0 @@

dist/types/index.d.ts

@@ -27,3 +27,3 @@ interface Cache {
     */
-    moduleCache: Record<string, Module>;
+    moduleCache?: Record<string, Module>;
     /**
@@ -87,3 +87,3 @@ * Called by the library when it needs a file.
      * Here we handle space limitation in a very basic way.
-     * Maybe (not tested), the following lib may help you to gain more space [pako](https://github.com/nodeca/pako)
+     * Maybe (not tested), the following libraries may help you to gain more space [pako](https://github.com/nodeca/pako), [lz-string](https://github.com/pieroxy/lz-string/)
      * ```javascript
@@ -102,3 +102,4 @@ *	...
      *					break;
-     *				} catch(ex) { // handle: Uncaught DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'XXX' exceeded the quota
+     *				} catch(ex) {
+     *					// here we handle DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'XXX' exceeded the quota
      *
@@ -134,2 +135,19 @@ *					window.localStorage.removeItem(window.localStorage.key(0));
     log?(type: string, ...data: any[]): void;
+    /**
+     * Called when the lib requires a module. Do return `undefined` to let the library handle this.
+     * @param path  The path of the module.
+     * @param options  The options object.
+     * @returns A Promise of the module or undefined
+     *
+     * ```javascript
+     *	...
+     *	loadModule(path, options) {
+     *
+     *		if ( path === 'vue' )
+     *			return Vue;
+     *		},
+     *	...
+     * ```
+     */
+    loadModule?(path: string, options: Options): Promise<Module> | undefined;
 }
@@ -173,2 +191,3 @@ /**
  * **example using `Vue.defineAsyncComponent`:**
+ *
  * ```javascript
@@ -185,14 +204,18 @@ *
  *
- * **example using await:**
- * _the following code requires to be placed in an async function_
+ * **example using `await`:**
  *
  * ```javascript
+
+ * ;(async () => {
  *
- *	const app = Vue.createApp({
- *		components: {
- *			'my-component': await loadModule('./myComponent.vue', options)
- *		},
- *		template: '<my-component></my-component>'
- *	});
+ *		const app = Vue.createApp({
+ *			components: {
+ *				'my-component': await loadModule('./myComponent.vue', options)
+ *			},
+ *			template: '<my-component></my-component>'
+ *		});
  *
+ * })()
+ * .catch(ex => console.error(ex));
+ *
  * ```
@@ -199,0 +222,0 @@ *

package.json

@@ -18,3 +18,3 @@ {
   "license": "MIT",
-  "version": "0.2.16",
+  "version": "0.2.17",
   "browserslist": "> 1%, last 2 versions, Firefox ESR, not dead, not ie 11",
@@ -21,0 +21,0 @@ "main": "dist/vue3-sfc-loader.js",

README.md

@@ -11,5 +11,6 @@ # vue3-sfc-loader
  * Focuses on component compilation. Network, styles injection and cache are up to you (see [example below](#example))
- * You can [build your own version](#build-your-own-version) and easily customize browser support
- * Properly reports template, styles or script errors through the [log callback](docs/api/interfaces/options.md#log)
+ * Embedded ES6 modules support (including `import()`)
  * Support custom CSS, HTML and Script language, see [pug example](docs/examples.md#using-another-template-language-pug)
+ * Properly reports template, style or script errors through the [log callback](docs/api/interfaces/options.md#log)
+ * You can [build your own version](#build-your-own-version) and easily customize browsers you need to support
 
@@ -103,3 +104,3 @@
 
-  `vue3-sfc-loader.js` = `Webpack`( `@vue/compiler-sfc` + `@babel` )
+  [`vue3-sfc-loader.js`](https://unpkg.com/vue3-sfc-loader@0.2.16/dist/report.html) = `Webpack`( `@vue/compiler-sfc` + `@babel` )
 
@@ -106,0 +107,0 @@

src/index.ts

@@ -95,3 +95,3 @@ import { posix as Path } from 'path'
 */
-	moduleCache: Record<string, Module>,
+	moduleCache?: Record<string, Module>,
 
@@ -165,3 +165,3 @@
  * Here we handle space limitation in a very basic way.
- * Maybe (not tested), the following lib may help you to gain more space [pako](https://github.com/nodeca/pako)
+ * Maybe (not tested), the following libraries may help you to gain more space [pako](https://github.com/nodeca/pako), [lz-string](https://github.com/pieroxy/lz-string/)
  * ```javascript
@@ -180,3 +180,4 @@ *	...
  *					break;
- *				} catch(ex) { // handle: Uncaught DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'XXX' exceeded the quota
+ *				} catch(ex) {
+ *					// here we handle DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'XXX' exceeded the quota
  *	
@@ -207,3 +208,3 @@ *					window.localStorage.removeItem(window.localStorage.key(0));
  *	log(type, ...args) {
- *		
+ *	
  *		console.log(type, ...args);
@@ -215,2 +216,22 @@ *	},
 	log?(type : string, ...data : any[]) : void,
+
+
+/**
+ * Called when the lib requires a module. Do return `undefined` to let the library handle this.
+ * @param path  The path of the module.
+ * @param options  The options object.
+ * @returns A Promise of the module or undefined
+ *
+ * ```javascript
+ *	...
+ *	loadModule(path, options) {
+ *	
+ *		if ( path === 'vue' )
+ *			return Vue;
+ *		},
+ *	...
+ * ```
+ */
+	loadModule?(path : string, options : Options) : Promise<Module> | undefined,
+
 }
@@ -415,12 +436,4 @@
 
-	const { moduleCache } = options;
-
-	for ( const dep of deps ) {
-
-		const path = resolvePath(filename, dep);
-		if ( path in moduleCache )
-			continue;
-
-		moduleCache[path] = await loadModule(path, options);
-	}
+	for ( const dep of deps )
+		await loadModule(resolvePath(filename, dep), options);
 }
@@ -443,3 +456,3 @@
 
-		throw new Error(`${ absPath } not found`);
+		throw new Error(`${ absPath } not found in moduleCache`);
 	}
@@ -449,7 +462,3 @@
 
-		const absPath = resolvePath(filename, path);
-		if ( absPath in moduleCache )
-			return moduleCache[absPath];
-
-		return moduleCache[path] = await loadModule(path, options);
+		return await loadModule(resolvePath(filename, path), options);
 	}
@@ -515,3 +524,3 @@
 
-	const { moduleCache, compiledCache } = options;
+	const { compiledCache } = options;
 
@@ -689,3 +698,3 @@ const [ depsList, transformedSource ] = await withCache(compiledCache, [ version, source, filename ], async () => {
 
-		addStyle(style, scopeId);
+		addStyle(style, descStyle.scoped ? scopeId : undefined);
 	}
@@ -713,3 +722,4 @@
  *
- * **example using `Vue.defineAsyncComponent`:**  
+ * **example using `Vue.defineAsyncComponent`:**
+ *
  * ```javascript
@@ -726,14 +736,18 @@ *
  *
- * **example using await:**  
- * _the following code requires to be placed in an async function_
+ * **example using `await`:**
  *
  * ```javascript
+
+ * ;(async () => {
  *
- *	const app = Vue.createApp({
- *		components: {
- *			'my-component': await loadModule('./myComponent.vue', options)
- *		},
- *		template: '<my-component></my-component>'
- *	});
+ *		const app = Vue.createApp({
+ *			components: {
+ *				'my-component': await loadModule('./myComponent.vue', options)
+ *			},
+ *			template: '<my-component></my-component>'
+ *		});
  *
+ * })()
+ * .catch(ex => console.error(ex));
+ *
  * ```
@@ -745,8 +759,20 @@ *
 	const {
-		moduleCache = throwNotDefined('options.moduleCache'),
+		moduleCache = (options.moduleCache = {}),
 		getFile = throwNotDefined('options.getFile()'),
 		addStyle = throwNotDefined('options.addStyle()'),
-		additionalModuleHandlers = {}
+		additionalModuleHandlers = {},
+		loadModule,
 	} = options;
 
+	if ( path in moduleCache )
+		return moduleCache[path];
+
+	if ( loadModule ) {
+
+		const module = await loadModule(path, options);
+		if ( module !== undefined )
+			return moduleCache[path] = module;
+	}
+
+
 	const moduleHandlers = { ...defaultModuleHandlers, ...additionalModuleHandlers };
@@ -764,3 +790,3 @@
 
-	return moduleHandlers[file.extname](file.content, path, options);
+	return moduleCache[path] = moduleHandlers[file.extname](file.content, path, options);
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

7243

increased by0.64%

Number of lines in readme file

128

increased by0.79%

Worsened metrics

Total package byte prevSize

7336291

decreased by-1.67%

Number of package files

21

decreased by-8.7%

No dependency changes