vue3-sfc-loader
Advanced tools
Comparing version 0.2.7 to 0.2.8
@@ -1,5 +0,10 @@ | ||
# Changelog | ||
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. | ||
### [0.2.8](https://github.com/FranckFreiburger/vue3-sfc-loader/compare/v0.2.7...v0.2.8) (2020-11-27) | ||
### Bug Fixes | ||
* **core:** add missing scoped option in sfc_compileTemplate() call ([ed99480](https://github.com/FranckFreiburger/vue3-sfc-loader/commit/ed994807f3b294a2fd9a5b98cfd9ac993ffb2fe8)) | ||
* **docs:** unpkg.com CDN url ([06f0378](https://github.com/FranckFreiburger/vue3-sfc-loader/commit/06f0378e27d7e03eeac16558d8b8bfcc3d82c584)) | ||
### [0.2.7](https://github.com/FranckFreiburger/vue3-sfc-loader/compare/v0.2.3...v0.2.7) (2020-11-27) | ||
@@ -6,0 +11,0 @@ |
@@ -30,2 +30,3 @@ interface Cache { | ||
* getFile(url) { | ||
* | ||
* return fetch(url).then(response => response.ok ? response.text() : Promise.reject(response)); | ||
@@ -58,3 +59,3 @@ * }, | ||
/** | ||
* Additional babel plugins | ||
* Additional babel plugins. [TBD] | ||
* | ||
@@ -68,12 +69,4 @@ * ```javascript | ||
/** | ||
* Additional module type handlers | ||
* Additional module type handlers. see [[ModuleHandler]] | ||
* | ||
* ```javascript | ||
* ... | ||
* additionalModuleHandlers: { | ||
* '.json': (source, path, options) => JSON.parse(source), | ||
* } | ||
* ... | ||
* ``` | ||
* | ||
*/ | ||
@@ -86,4 +79,6 @@ additionalModuleHandlers?: Record<string, ModuleHandler>; | ||
* **example:** | ||
* In the following example, we cache the compiled code in the browser's local storage. Note that local storage is a limited place, here we handle this in a very basic way. | ||
* Maybe (not tested), the following lib may help you [pako](https://github.com/nodeca/pako) | ||
* | ||
* In the following example, we cache the compiled code in the browser's local storage. Note that local storage is a limited place (usually 5MB). | ||
* 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) | ||
* ```javascript | ||
@@ -118,3 +113,3 @@ * ... | ||
/** | ||
* Called by the library when there is somthing to log (eg. ) | ||
* Called by the library when there is somthing to log (eg. scripts compilation errors, template compilation errors, template compilation tips, style compilation errors, ...) | ||
* @param type the type of the notification | ||
@@ -136,3 +131,3 @@ * @param args the values to log | ||
/** | ||
* @ignore | ||
* This just represents a loaded js module | ||
*/ | ||
@@ -142,3 +137,15 @@ interface Module { | ||
/** | ||
* A callback that loow | ||
* Called by the library when it does not handle a loaded file type (eg. .json files). | ||
* see [[additionalModuleHandlers]] | ||
* @param source The content of the file | ||
* @param path The path of the file | ||
* @param options The options | ||
* | ||
* ```javascript | ||
* ... | ||
* additionalModuleHandlers: { | ||
* '.json': (source, path, options) => JSON.parse(source), | ||
* } | ||
* ... | ||
* ``` | ||
*/ | ||
@@ -149,3 +156,3 @@ interface ModuleHandler { | ||
/** | ||
* the version of the library | ||
* the version of the library (process.env.VERSION is set by webpack, at compile-time) | ||
*/ | ||
@@ -162,8 +169,8 @@ export declare const version: string; | ||
* | ||
* const app = Vue.createApp({ | ||
* components: { | ||
* 'my-component': Vue.defineAsyncComponent( () => loadModule('./myComponent.vue', options) ) | ||
* }, | ||
* template: '<my-component></my-component>' | ||
* }); | ||
* const app = Vue.createApp({ | ||
* components: { | ||
* 'my-component': Vue.defineAsyncComponent( () => loadModule('./myComponent.vue', options) ) | ||
* }, | ||
* template: '<my-component></my-component>' | ||
* }); | ||
* | ||
@@ -177,8 +184,8 @@ * ``` | ||
* | ||
* 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>' | ||
* }); | ||
* | ||
@@ -185,0 +192,0 @@ * ``` |
@@ -0,1 +1,3 @@ | ||
**[vue3-sfc-loader](../README.md)** | ||
> [Globals](../README.md) / Cache | ||
@@ -22,3 +24,3 @@ | ||
*Defined in [index.ts:62](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L62)* | ||
*Defined in [index.ts:63](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L63)* | ||
@@ -39,3 +41,3 @@ #### Parameters: | ||
*Defined in [index.ts:63](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L63)* | ||
*Defined in [index.ts:64](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L64)* | ||
@@ -42,0 +44,0 @@ #### Parameters: |
@@ -0,1 +1,3 @@ | ||
**[vue3-sfc-loader](../README.md)** | ||
> [Globals](../README.md) / ModuleHandler | ||
@@ -5,3 +7,4 @@ | ||
A callback that loow | ||
Called by the library when it does not handle a loaded file type (eg. .json files). | ||
see [additionalModuleHandlers](options.md#additionalmodulehandlers) | ||
@@ -14,16 +17,17 @@ ## Hierarchy | ||
▸ (`source`: string, `path`: string, `options`: [Options](options.md)): Promise\<Module> | ||
▸ (`source`: string, `path`: string, `options`: [Options](options.md)): Promise\<[Module](module.md)> | ||
*Defined in [index.ts:218](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L218)* | ||
*Defined in [index.ts:227](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L227)* | ||
A callback that loow | ||
Called by the library when it does not handle a loaded file type (eg. .json files). | ||
see [additionalModuleHandlers](options.md#additionalmodulehandlers) | ||
#### Parameters: | ||
Name | Type | | ||
------ | ------ | | ||
`source` | string | | ||
`path` | string | | ||
`options` | [Options](options.md) | | ||
Name | Type | Description | | ||
------ | ------ | ------ | | ||
`source` | string | The content of the file | | ||
`path` | string | The path of the file | | ||
`options` | [Options](options.md) | The options ```javascript ... additionalModuleHandlers: { '.json': (source, path, options) => JSON.parse(source), } ... ``` | | ||
**Returns:** Promise\<Module> | ||
**Returns:** Promise\<[Module](module.md)> |
@@ -0,1 +1,3 @@ | ||
**[vue3-sfc-loader](../README.md)** | ||
> [Globals](../README.md) / Options | ||
@@ -30,5 +32,5 @@ | ||
*Defined in [index.ts:134](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L134)* | ||
*Defined in [index.ts:136](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L136)* | ||
Additional babel plugins | ||
Additional babel plugins. [TBD] | ||
@@ -46,14 +48,6 @@ ```javascript | ||
*Defined in [index.ts:149](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L149)* | ||
*Defined in [index.ts:143](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L143)* | ||
Additional module type handlers | ||
Additional module type handlers. see [ModuleHandler](modulehandler.md) | ||
```javascript | ||
... | ||
additionalModuleHandlers: { | ||
'.json': (source, path, options) => JSON.parse(source), | ||
} | ||
... | ||
``` | ||
___ | ||
@@ -65,3 +59,3 @@ | ||
*Defined in [index.ts:186](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L186)* | ||
*Defined in [index.ts:182](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L182)* | ||
@@ -72,4 +66,6 @@ [get](cache.md#get)() and [set](cache.md#set)() functions of this object are called when the lib needs to save or load already compiled code. get and set functions must return a `Promise` (or can be `async`). | ||
**example:** | ||
In the following example, we cache the compiled code in the browser's local storage. Note that local storage is a limited place, here we handle this in a very basic way. | ||
Maybe (not tested), the following lib may help you [pako](https://github.com/nodeca/pako) | ||
In the following example, we cache the compiled code in the browser's local storage. Note that local storage is a limited place (usually 5MB). | ||
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) | ||
```javascript | ||
@@ -106,5 +102,5 @@ ... | ||
• **moduleCache**: Record\<string, Module> | ||
• **moduleCache**: Record\<string, [Module](module.md)> | ||
*Defined in [index.ts:84](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L84)* | ||
*Defined in [index.ts:85](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L85)* | ||
@@ -129,3 +125,3 @@ Initial cache that will contain resolved dependencies. | ||
*Defined in [index.ts:123](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L123)* | ||
*Defined in [index.ts:125](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L125)* | ||
@@ -162,3 +158,3 @@ Called by the library when CSS style must be added in the HTML document. | ||
*Defined in [index.ts:101](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L101)* | ||
*Defined in [index.ts:103](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L103)* | ||
@@ -181,2 +177,3 @@ Called by the library when it needs a file. | ||
getFile(url) { | ||
return fetch(url).then(response => response.ok ? response.text() : Promise.reject(response)); | ||
@@ -193,5 +190,5 @@ }, | ||
*Defined in [index.ts:204](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L204)* | ||
*Defined in [index.ts:200](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L200)* | ||
Called by the library when there is somthing to log (eg. ) | ||
Called by the library when there is somthing to log (eg. scripts compilation errors, template compilation errors, template compilation tips, style compilation errors, ...) | ||
@@ -198,0 +195,0 @@ #### Parameters: |
@@ -0,1 +1,3 @@ | ||
**[vue3-sfc-loader](README.md)** | ||
> Globals | ||
@@ -10,2 +12,3 @@ | ||
* [Cache](interfaces/cache.md) | ||
* [Module](interfaces/module.md) | ||
* [ModuleHandler](interfaces/modulehandler.md) | ||
@@ -28,5 +31,5 @@ * [Options](interfaces/options.md) | ||
*Defined in [index.ts:234](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L234)* | ||
*Defined in [index.ts:244](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L244)* | ||
the version of the library | ||
the version of the library (process.env.VERSION is set by webpack, at compile-time) | ||
@@ -37,5 +40,5 @@ ## Functions | ||
▸ **loadModule**(`path`: string, `options`: [Options](interfaces/options.md)): Promise\<Module> | ||
▸ **loadModule**(`path`: string, `options`: [Options](interfaces/options.md)): Promise\<[Module](interfaces/module.md)> | ||
*Defined in [index.ts:660](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/cca6af9/src/index.ts#L660)* | ||
*Defined in [index.ts:672](https://github.com/FranckFreiburger/vue3-sfc-loader/blob/8c31317/src/index.ts#L672)* | ||
@@ -51,3 +54,3 @@ This is the main function. | ||
**Returns:** Promise\<Module> | ||
**Returns:** Promise\<[Module](interfaces/module.md)> | ||
@@ -59,8 +62,8 @@ A Promise of the component | ||
const app = Vue.createApp({ | ||
components: { | ||
'my-component': Vue.defineAsyncComponent( () => loadModule('./myComponent.vue', options) ) | ||
}, | ||
template: '<my-component></my-component>' | ||
}); | ||
const app = Vue.createApp({ | ||
components: { | ||
'my-component': Vue.defineAsyncComponent( () => loadModule('./myComponent.vue', options) ) | ||
}, | ||
template: '<my-component></my-component>' | ||
}); | ||
@@ -74,9 +77,9 @@ ``` | ||
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>' | ||
}); | ||
``` |
@@ -11,18 +11,18 @@ { | ||
"license": "MIT", | ||
"version": "0.2.7", | ||
"version": "0.2.8", | ||
"main": "dist/vue3-sfc-loader.js", | ||
"scripts": { | ||
"test": "cd test && yarn run start", | ||
"dev": "webpack --mode=development --config ./build/webpack.config.js --progress --watch", | ||
"build": "webpack --mode=production --config ./build/webpack.config.js --progress --env targetsBrowsers=\"> 1%, last 2 versions, Firefox ESR, not dead, not ie 11\"", | ||
"docs": "typedoc --plugin typedoc-plugin-markdown --mode file --tsconfig ./build/tsconfig.json --inputFiles ./src/index.ts --out ./docs --readme none --stripInternal --hideProjectName true --hideBreadcrumbs false --namedAnchors true", | ||
"pushDocs": "npm run docs && git add docs/ && git commit -m \"chore(docs) build docs\" docs", | ||
"release": "standard-version" | ||
"docs": "typedoc --plugin typedoc-plugin-markdown --mode file --tsconfig ./build/tsconfig.json --inputFiles ./src/index.ts --out ./docs --readme none --stripInternal --namedAnchors true", | ||
"pushDocs": "cross-env-shell yarn run docs && git add docs/ && git commit -m \"chore(docs) build docs v$npm_package_version\" docs", | ||
"release": "standard-version --header \"\"" | ||
}, | ||
"standard-version": { | ||
"scripts": { | ||
"postbump": "npm run pushDocs", | ||
"postcommit": "npm run build" | ||
"postbump": "yarn run pushDocs", | ||
"postcommit": "yarn run build" | ||
} | ||
}, | ||
"dependencies": {}, | ||
"devDependencies": { | ||
@@ -43,4 +43,4 @@ "@babel/core": "^7.12.9", | ||
"caniuse-api": "^3.0.0", | ||
"conventional-changelog-cli": "^2.1.1", | ||
"core-js": "^3.8.0", | ||
"cross-env": "^7.0.2", | ||
"crypto-browserify": "^3.12.0", | ||
@@ -60,2 +60,3 @@ "duplicate-package-checker-webpack-plugin": "^3.0.0", | ||
"vm-browserify": "^1.1.2", | ||
"vue": "^3.0.0", | ||
"webpack": "^5.8.0", | ||
@@ -62,0 +63,0 @@ "webpack-bundle-analyzer": "^4.1.0", |
@@ -16,3 +16,3 @@ # vue3-sfc-loader | ||
<script src="https://unpkg.com/vue@next"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/vue3-sfc-loader@latest/dist/vue3-sfc-loader.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/vue3-sfc-loader/dist/vue3-sfc-loader.js"></script> | ||
<script> | ||
@@ -58,3 +58,3 @@ | ||
### Try it | ||
## Try it | ||
@@ -66,7 +66,13 @@ https://codepen.io/franckfreiburger/project/editor/AqPyBr | ||
at jsDelivr CDN: `https://cdn.jsdelivr.net/npm/vue3-sfc-loader@latest/dist/vue3-sfc-loader.js` | ||
latest minified version: | ||
- at jsDelivr CDN: https://cdn.jsdelivr.net/npm/vue3-sfc-loader/dist/vue3-sfc-loader.js | ||
- at UNPKG CDN: https://unpkg.com/vue3-sfc-loader/dist/vue3-sfc-loader.js | ||
### Bundle size | ||
- \~380 kB minified + bz2 | ||
- \~1600 kB minified | ||
## API | ||
## Public API | ||
**[loadModule](docs/README.md#loadmodule)**(`path`: string, `options`: [Options](docs/interfaces/options.md)): Promise\<Module> | ||
@@ -77,11 +83,12 @@ | ||
default (`npm run build`): | ||
`webpack --config ./build/webpack.config.js --mode=production --env targetsBrowsers="> 1%, last 2 versions, Firefox ESR, not dead, not ie 11"` | ||
`webpack --config ./build/webpack.config.js --mode=production --env targetsBrowsers="> 1%, last 2 versions, Firefox ESR, not dead, not ie 11"` | ||
_see `package.json` "build" script_ | ||
### targetsBrowsers | ||
see https://github.com/browserslist/browserslist#queries | ||
see [browserslist queries](https://github.com/browserslist/browserslist#queries) | ||
## How it works | ||
@@ -102,9 +109,11 @@ | ||
### Bundle size | ||
- 1600 Kb minified | ||
- 380 KB bz2 | ||
## Previous version (for vue2) | ||
see https://github.com/FranckFreiburger/http-vue-loader | ||
### More complete example | ||
## Other examples | ||
### more complete API usage example | ||
```html | ||
@@ -116,3 +125,3 @@ <!DOCTYPE html> | ||
<script src="https://unpkg.com/vue@next"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/vue3-sfc-loader@latest/dist/vue3-sfc-loader.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/vue3-sfc-loader/dist/vue3-sfc-loader.js"></script> | ||
@@ -158,4 +167,6 @@ <script> | ||
break; | ||
} catch(ex) { // handle: Uncaught DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'XXX' exceeded the quota | ||
} catch(ex) { | ||
// handle: Uncaught DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'XXX' exceeded the quota | ||
window.localStorage.removeItem(window.localStorage.key(0)); | ||
@@ -221,1 +232,49 @@ } | ||
``` | ||
### using another template language (pug) | ||
```html | ||
<!DOCTYPE html> | ||
<html> | ||
<body> | ||
<div id="app"></div> | ||
<script src="https://unpkg.com/vue@next"></script> | ||
<script src="https://pugjs.org/js/pug.js"></script> | ||
<script src="vue3-sfc-loader.js"></script> | ||
<script> | ||
/* <!-- */ | ||
const sfcSontent = ` | ||
<template lang="pug"> | ||
ul | ||
each val in ['p', 'u', 'g'] | ||
li= val | ||
</template> | ||
`; | ||
/* --> */ | ||
const options = { | ||
moduleCache: { | ||
vue: Vue, | ||
pug: require('pug'), | ||
}, | ||
getFile(url) { | ||
if ( url === './myPugComponent.vue' ) | ||
return Promise.resolve(sfcSontent); | ||
return fetch(url).then(response => response.ok ? response.text() : Promise.reject(response)); | ||
}, | ||
} | ||
const { loadModule } = window["vue3-sfc-loader"]; | ||
Vue.createApp(Vue.defineAsyncComponent(() => loadModule('./myPugComponent.vue', options))).mount('#app'); | ||
</script> | ||
</body> | ||
</html> | ||
``` |
156
src/index.ts
@@ -29,3 +29,4 @@ import { posix as Path } from 'path' | ||
compileTemplate as sfc_compileTemplate, | ||
SFCAsyncStyleCompileOptions | ||
SFCAsyncStyleCompileOptions, | ||
SFCTemplateCompileOptions | ||
} from '@vue/compiler-sfc' | ||
@@ -69,3 +70,3 @@ | ||
interface Options { | ||
// ts: https://www.typescriptlang.org/docs/handbook/interfaces.html#indexable-types | ||
// ts: https://www.typescriptlang.org/docs/handbook/interfaces.html#indexable-types | ||
@@ -98,2 +99,3 @@ /** | ||
* getFile(url) { | ||
* | ||
* return fetch(url).then(response => response.ok ? response.text() : Promise.reject(response)); | ||
@@ -130,3 +132,3 @@ * }, | ||
/** | ||
* Additional babel plugins | ||
* Additional babel plugins. [TBD] | ||
* | ||
@@ -142,12 +144,4 @@ * ```javascript | ||
/** | ||
* Additional module type handlers | ||
* Additional module type handlers. see [[ModuleHandler]] | ||
* | ||
* ```javascript | ||
* ... | ||
* additionalModuleHandlers: { | ||
* '.json': (source, path, options) => JSON.parse(source), | ||
* } | ||
* ... | ||
* ``` | ||
* | ||
*/ | ||
@@ -162,4 +156,6 @@ additionalModuleHandlers?: Record<string, ModuleHandler>, | ||
* **example:** | ||
* In the following example, we cache the compiled code in the browser's local storage. Note that local storage is a limited place, here we handle this in a very basic way. | ||
* Maybe (not tested), the following lib may help you [pako](https://github.com/nodeca/pako) | ||
* | ||
* In the following example, we cache the compiled code in the browser's local storage. Note that local storage is a limited place (usually 5MB). | ||
* 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) | ||
* ```javascript | ||
@@ -196,3 +192,3 @@ * ... | ||
/** | ||
* Called by the library when there is somthing to log (eg. ) | ||
* Called by the library when there is somthing to log (eg. scripts compilation errors, template compilation errors, template compilation tips, style compilation errors, ...) | ||
* @param type the type of the notification | ||
@@ -217,3 +213,3 @@ * @param args the values to log | ||
/** | ||
* @ignore | ||
* This just represents a loaded js module | ||
*/ | ||
@@ -223,4 +219,17 @@ interface Module { | ||
/** | ||
* A callback that loow | ||
* Called by the library when it does not handle a loaded file type (eg. .json files). | ||
* see [[additionalModuleHandlers]] | ||
* @param source The content of the file | ||
* @param path The path of the file | ||
* @param options The options | ||
* | ||
* ```javascript | ||
* ... | ||
* additionalModuleHandlers: { | ||
* '.json': (source, path, options) => JSON.parse(source), | ||
* } | ||
* ... | ||
* ``` | ||
*/ | ||
@@ -240,4 +249,5 @@ interface ModuleHandler { | ||
/** | ||
* the version of the library | ||
* the version of the library (process.env.VERSION is set by webpack, at compile-time) | ||
*/ | ||
@@ -326,2 +336,3 @@ export const version : string = process.env.VERSION; | ||
/** | ||
* relative to absolute module path resolution. | ||
* @internal | ||
@@ -339,3 +350,3 @@ */ | ||
/** | ||
* Just load and cache deps | ||
* Just load and cache given dependencies. | ||
* @internal | ||
@@ -407,3 +418,3 @@ */ | ||
*/ | ||
async function withCache( cacheInstance : Cache, key : any[], valueFactory: ValueFactory ) { | ||
async function withCache( cacheInstance : Cache, key : any[], valueFactory : ValueFactory ) { | ||
@@ -457,2 +468,5 @@ let cachePrevented = false; | ||
configFile: false, | ||
// @ts-ignore // not defined in https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/babel__core/index.d.ts | ||
cloneInputAst: false, // doc: can improve parsing performance if the input AST is not used elsewhere. | ||
}); | ||
@@ -499,2 +513,21 @@ | ||
const compileTemplateOptions : SFCTemplateCompileOptions = { | ||
// hack, since sourceMap is not configurable an we want to get rid of source-map dependency. see genSourcemap | ||
compiler: { ...vue_CompilerDOM, compile: (template, options) => vue_CompilerDOM.compile(template, { ...options, sourceMap: genSourcemap }) }, | ||
source: descriptor.template.content, | ||
filename: descriptor.filename, | ||
isProd, | ||
scoped: hasScoped, | ||
id: scopeId, | ||
compilerOptions: { | ||
scopeId, | ||
mode: 'module', // see: https://github.com/vuejs/vue-next/blob/15baaf14f025f6b1d46174c9713a2ec517741d0d/packages/compiler-core/src/options.ts#L160 | ||
}, | ||
// transformAssetUrls | ||
preprocessLang: descriptor.template.lang, | ||
preprocessCustomRequire: id => moduleCache[id], // makes consolidate optional, see https://github.com/vuejs/vue-next/blob/15baaf14f025f6b1d46174c9713a2ec517741d0d/packages/compiler-sfc/src/compileTemplate.ts#L111-L113 | ||
} | ||
const component = {}; | ||
@@ -516,31 +549,21 @@ | ||
babelParserPlugins, | ||
templateOptions: compileTemplateOptions, | ||
}); | ||
if ( script.scriptAst === undefined ) { // if error | ||
const ast = babel_parse(script.content, { | ||
// doc: https://babeljs.io/docs/en/babel-parser#options | ||
plugins: [ | ||
// see https://github.com/vuejs/vue-next/blob/15baaf14f025f6b1d46174c9713a2ec517741d0d/packages/compiler-sfc/src/compileScript.ts#L63 | ||
...vue_babelParserDefaultPlugins, | ||
'jsx', | ||
...babelParserPlugins | ||
], | ||
sourceType: 'module', | ||
sourceFilename: filename, | ||
}); | ||
try { | ||
renameDynamicImport(ast); | ||
const depsList = parseDeps(ast); | ||
// get the error | ||
const ast = babel_parse(descriptor.script.content, { | ||
// doc: https://babeljs.io/docs/en/babel-parser#options | ||
plugins: [...vue_babelParserDefaultPlugins, 'jsx', ...babelParserPlugins], // see https://github.com/vuejs/vue-next/blob/15baaf14f025f6b1d46174c9713a2ec517741d0d/packages/compiler-sfc/src/compileScript.ts#L63 | ||
sourceType: 'module', | ||
sourceFilename: filename, | ||
}); | ||
} catch (ex) { | ||
preventCache(); | ||
log?.('error', 'SFC script', ex); | ||
} | ||
} | ||
const program = t.program(script.scriptAst, [], 'module') // doc: https://babeljs.io/docs/en/babel-types#program | ||
program.loc = script.loc; | ||
const file = t.file(program); // doc: https://babeljs.io/docs/en/babel-types#file | ||
renameDynamicImport(file); | ||
const depsList = parseDeps(file); | ||
const transformedScript = await babel_transformFromAstAsync(program, script.content, { | ||
const transformedScript = await babel_transformFromAstAsync(ast, script.content, { | ||
sourceMaps: genSourcemap, // https://babeljs.io/docs/en/options#sourcemaps | ||
@@ -553,2 +576,5 @@ plugins: [ // https://babeljs.io/docs/en/options#plugins | ||
configFile: false, | ||
// @ts-ignore // not defined in https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/babel__core/index.d.ts | ||
cloneInputAst: false, // doc: can improve parsing performance if the input AST is not used elsewhere. | ||
}); | ||
@@ -568,17 +594,3 @@ | ||
const template = sfc_compileTemplate({ | ||
// hack, since sourceMap is not configurable an we want to get rid of source-map dependency. see genSourcemap | ||
compiler: { ...vue_CompilerDOM, compile: (template, options) => vue_CompilerDOM.compile(template, { ...options, sourceMap: genSourcemap }) }, | ||
source: descriptor.template.content, | ||
filename: descriptor.filename, | ||
isProd, | ||
id: scopeId, | ||
compilerOptions: { | ||
scopeId, | ||
mode: 'module', // see: https://github.com/vuejs/vue-next/blob/15baaf14f025f6b1d46174c9713a2ec517741d0d/packages/compiler-core/src/options.ts#L160 | ||
}, | ||
// transformAssetUrls | ||
preprocessLang: descriptor.template.lang, | ||
preprocessCustomRequire: id => moduleCache[id], // makes consolidate optional, see https://github.com/vuejs/vue-next/blob/15baaf14f025f6b1d46174c9713a2ec517741d0d/packages/compiler-sfc/src/compileTemplate.ts#L111-L113 | ||
}); | ||
const template = sfc_compileTemplate(compileTemplateOptions); | ||
@@ -654,8 +666,8 @@ if ( template.errors.length ) { | ||
* | ||
* const app = Vue.createApp({ | ||
* components: { | ||
* 'my-component': Vue.defineAsyncComponent( () => loadModule('./myComponent.vue', options) ) | ||
* }, | ||
* template: '<my-component></my-component>' | ||
* }); | ||
* const app = Vue.createApp({ | ||
* components: { | ||
* 'my-component': Vue.defineAsyncComponent( () => loadModule('./myComponent.vue', options) ) | ||
* }, | ||
* template: '<my-component></my-component>' | ||
* }); | ||
* | ||
@@ -669,8 +681,8 @@ * ``` | ||
* | ||
* 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>' | ||
* }); | ||
* | ||
@@ -677,0 +689,0 @@ * ``` |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
24
273
3928438
34
7474