Skip to content

Commit 916be69

Browse files
save file
1 parent f359bf0 commit 916be69

1 file changed

Lines changed: 272 additions & 0 deletions

File tree

Lines changed: 272 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,272 @@
1+
2+
<link rel=stylesheet href='https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/css/xterm.css'>
3+
4+
<style>
5+
6+
body
7+
{margin:20px;display:flex;flex-direction:column;gap:10px;font-family:arial}
8+
9+
iframe
10+
{width:100%;height:300px}
11+
12+
#terminal
13+
{height:500px}
14+
15+
</style>
16+
17+
<h3>rollup example</h3>
18+
19+
<iframe id=iframe></iframe>
20+
21+
<div id=terminal></div>
22+
23+
24+
<script>
25+
26+
(()=>{
27+
28+
var term;
29+
var webcontainer;
30+
var files = {};
31+
32+
33+
var packages = ['acorn'];
34+
var filename = 'acorn.js';
35+
36+
files['entry.js'] = `
37+
38+
import * as acorn from 'acorn';
39+
export {acorn};
40+
41+
//export default espree; // iife / umd
42+
43+
`;
44+
45+
46+
47+
48+
async function setup(){
49+
50+
var {Terminal} = await import('https://cdn.jsdelivr.net/npm/@xterm/xterm/+esm');
51+
var {FitAddon} = await import('https://cdn.jsdelivr.net/npm/@xterm/addon-fit/+esm');
52+
53+
term = new Terminal();
54+
var fitAddon = new FitAddon();
55+
term.loadAddon(fitAddon);
56+
term.open(terminal);
57+
fitAddon.fit();
58+
console.clear();
59+
console.log('rollup example');
60+
console.log();
61+
}//setup
62+
63+
64+
setTimeout(start,50);
65+
66+
67+
async function start(){
68+
69+
await setup();
70+
71+
72+
for(var key in files){
73+
74+
files[key] = {file:{contents:files[key]}};
75+
76+
}//for
77+
78+
79+
console.log('download ...');
80+
var {WebContainer} = await import('https://cdn.jsdelivr.net/npm/@webcontainer/api/+esm');
81+
82+
console.log('booting ...');
83+
webcontainer = await WebContainer.boot();
84+
85+
console.log('mounting file system ...');
86+
await webcontainer.mount(files);
87+
88+
89+
await install();
90+
await package_json();
91+
await install_rollup();
92+
93+
94+
await rollup();
95+
96+
var uint8 = await webcontainer.fs.readFile('acorn.m.js');
97+
var blob = new Blob([uint8],{type:'text/javascript'});
98+
var url = window.URL.createObjectURL(blob);
99+
100+
console.log('download...');
101+
102+
var a = document.createElement('a');
103+
a.href = url;
104+
a.download = 'acorn.m.js';
105+
document.body.append(a);
106+
a.click();
107+
108+
console.log('done');
109+
return;
110+
111+
var {espree} = await import('https://libs.ext-code.com/external/js/espree/espree.m.js');
112+
var {estraverse} = await import(url);
113+
114+
var code = `
115+
116+
function fn(){
117+
118+
console.log('123');
119+
120+
}//fn
121+
122+
`;
123+
124+
var ast = espree.parse(code);
125+
126+
estraverse.traverse(ast, {
127+
enter(node) {
128+
if (node.type === 'FunctionDeclaration') {
129+
console.log('FunctionDeclaration:', node.id.name);
130+
}
131+
132+
if (
133+
node.type === 'VariableDeclarator' &&
134+
node.init &&
135+
(node.init.type === 'ArrowFunctionExpression' ||
136+
node.init.type === 'FunctionExpression')
137+
) {
138+
console.log('Function assigned to variable:', node.id.name);
139+
}
140+
}
141+
});
142+
143+
144+
145+
console.log('done.');
146+
147+
148+
async function install(){
149+
var str = packages.join(' ');
150+
console.log('npm install',str,'...');
151+
packages.unshift('install');
152+
var process = await webcontainer.spawn('npm',packages);
153+
var stream = new WritableStream({write(data){term.write(data)}});
154+
process.output.pipeTo(stream)
155+
var code = await process.exit;
156+
if(code!=0){
157+
console.log('an error occurred');
158+
}
159+
return code;
160+
161+
}//install
162+
163+
164+
async function package_json(){
165+
console.log('npm install ( package.json ) ...');
166+
var process = await webcontainer.spawn('npm',['install']);
167+
var stream = new WritableStream({write(data){term.write(data)}});
168+
process.output.pipeTo(stream)
169+
var code = await process.exit;
170+
if(code!=0){
171+
console.log('an error occurred');
172+
}
173+
return code;
174+
175+
}//package_json
176+
177+
178+
async function install_rollup(){
179+
180+
var packages = [
181+
'rollup',
182+
'@rollup/plugin-commonjs',
183+
'@rollup/plugin-node-resolve',
184+
'@rollup/plugin-json',
185+
'rollup-plugin-polyfill-node'
186+
];
187+
console.log('npm install',packages.join(' '),'...');
188+
packages.unshift('install');
189+
190+
var process = await webcontainer.spawn('npm',packages);
191+
var stream = new WritableStream({write(data){term.write(data)}});
192+
process.output.pipeTo(stream)
193+
var code = await process.exit;
194+
if(code!=0){
195+
console.log('an error occurred');
196+
}
197+
return code;
198+
199+
}//install_rollup
200+
201+
202+
async function rollup(){
203+
console.log('perform rollup ...');
204+
var process = await webcontainer.spawn('npx',['-y','rollup','--config','rollup.config.js']);
205+
206+
var stream = new WritableStream({write(data){term.write(data)}});
207+
process.output.pipeTo(stream);
208+
209+
var code = await process.exit;
210+
if(code!=0){
211+
console.log('an error occurred');
212+
}
213+
return code;
214+
215+
}//rollup
216+
217+
218+
}//start
219+
220+
221+
//:
222+
223+
224+
files['package.json'] = `
225+
226+
{
227+
"name": "node-test",
228+
"version": "1.0.0",
229+
"scripts": {}
230+
}
231+
232+
`;
233+
234+
235+
files['rollup.config.js'] = `
236+
237+
import resolve from '@rollup/plugin-node-resolve';
238+
import commonjs from '@rollup/plugin-commonjs';
239+
import json from '@rollup/plugin-json';
240+
import nodePolyfills from 'rollup-plugin-polyfill-node';
241+
242+
export default {
243+
input : 'entry.js',
244+
output : {
245+
file : '${filename}',
246+
format : 'es'
247+
248+
//format : 'iife', // or 'umd'
249+
//name : 'espree', // This becomes window.espree
250+
//exports : 'default',
251+
252+
},
253+
plugins : [
254+
commonjs(),
255+
json(),
256+
nodePolyfills(),
257+
resolve({preferBuiltins:false})
258+
]
259+
};
260+
261+
`;
262+
263+
264+
265+
266+
})();
267+
268+
269+
</script>
270+
271+
272+

0 commit comments

Comments
 (0)