File tree Expand file tree Collapse file tree 2 files changed +34
-54
lines changed Expand file tree Collapse file tree 2 files changed +34
-54
lines changed Original file line number Diff line number Diff line change 11<!DOCTYPE html>
22< html >
33< body >
4- < div id ="app "> </ div >
5- < script src ="https://unpkg.com/vue@next "> </ script >
4+ < script src ="https://unpkg.com/vue@next/dist/vue.runtime.global.prod.js "> </ script >
65 < script src ="vue3-sfc-loader.js "> </ script >
76 < script >
87
9- const options = {
10-
11- moduleCache : {
12- vue : Vue ,
13- } ,
14-
15- getFile ( url ) {
16-
17- return fetch ( url ) . then ( response => response . ok ? response . text ( ) : Promise . reject ( response ) ) ;
18- } ,
19-
20- addStyle ( styleStr ) {
21- const style = document . createElement ( 'style' ) ;
22- style . textContent = styleStr ;
23- const ref = document . head . getElementsByTagName ( 'style' ) [ 0 ] || null ;
24- document . head . insertBefore ( style , ref ) ;
25- } ,
26-
27- log ( type , ...args ) {
28- console . log ( type , ...args ) ;
8+ /* <!-- */
9+ const config = {
10+ files : {
11+ '/component.vue' : `
12+ < script >
13+ const { test } = require('./foo/test.js')
14+ console.log( test() );
15+ </ script >
16+ `,
17+
18+ '/foo/test.js': `
19+ exports.test = function() {
20+
21+ return require('../bar/test.js').test();
22+ }
23+ `,
24+
25+ '/bar/test.js': `
26+ exports.test = function() {
27+
28+ return 'test_ok';
29+ }
30+ `
2931 }
30- }
32+ };
33+ /* --> */
3134
32- const { loadModule } = window [ "vue3-sfc-loader" ] ;
3335
34- const app = Vue . createApp ( {
35- components : {
36- 'my-component' : Vue . defineAsyncComponent ( ( ) => loadModule ( './myComponent.vue' , options ) ) ,
37- } ,
38- template : 'Hello <my-component></my-component>'
39- } ) ;
36+ const options = {
37+ moduleCache: { vue: Vue },
38+ getFile: url => config.files[url],
39+ addStyle: () => {},
40+ }
4041
41- app . mount ( '#app' ) ;
42+ Vue.createApp(Vue.defineAsyncComponent(() = > window['vue3-sfc-loader'].loadModule('/component.vue', options))).mount(document.body );
4243
4344 </ script >
4445</ body >
45- </ html >
46+ </ html >
47+
Load Diff This file was deleted.
You can’t perform that action at this time.
0 commit comments