Skip to content

Commit c9e313a

Browse files
javascript-2020javascript-2020
committed
save file
1 parent d415863 commit c9e313a

1 file changed

Lines changed: 223 additions & 0 deletions

File tree

‎npm/estraverse-browser/scripts/estraverse-browser.js‎

Lines changed: 223 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,223 @@
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 = ['estraverse'];
34+
var filename = 'estraverse.m.js';
35+
36+
files['entry.js'] = `
37+
38+
import * as estraverse from 'estraverse';
39+
export {estraverse};
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+
console.log('done.');
97+
98+
99+
async function install(){
100+
var str = packages.join(' ');
101+
console.log('npm install',str,'...');
102+
packages.unshift('install');
103+
var process = await webcontainer.spawn('npm',packages);
104+
var stream = new WritableStream({write(data){term.write(data)}});
105+
process.output.pipeTo(stream)
106+
var code = await process.exit;
107+
if(code!=0){
108+
console.log('an error occurred');
109+
}
110+
return code;
111+
112+
}//install
113+
114+
115+
async function package_json(){
116+
console.log('npm install ( package.json ) ...');
117+
var process = await webcontainer.spawn('npm',['install']);
118+
var stream = new WritableStream({write(data){term.write(data)}});
119+
process.output.pipeTo(stream)
120+
var code = await process.exit;
121+
if(code!=0){
122+
console.log('an error occurred');
123+
}
124+
return code;
125+
126+
}//package_json
127+
128+
129+
async function install_rollup(){
130+
131+
var packages = [
132+
'rollup',
133+
'@rollup/plugin-commonjs',
134+
'@rollup/plugin-node-resolve',
135+
'@rollup/plugin-json',
136+
'rollup-plugin-polyfill-node'
137+
];
138+
console.log('npm install',packages.join(' '),'...');
139+
packages.unshift('install');
140+
141+
var process = await webcontainer.spawn('npm',packages);
142+
var stream = new WritableStream({write(data){term.write(data)}});
143+
process.output.pipeTo(stream)
144+
var code = await process.exit;
145+
if(code!=0){
146+
console.log('an error occurred');
147+
}
148+
return code;
149+
150+
}//install_rollup
151+
152+
153+
async function rollup(){
154+
console.log('perform rollup ...');
155+
var process = await webcontainer.spawn('npx',['-y','rollup','--config','rollup.config.js']);
156+
157+
var stream = new WritableStream({write(data){term.write(data)}});
158+
process.output.pipeTo(stream);
159+
160+
var code = await process.exit;
161+
if(code!=0){
162+
console.log('an error occurred');
163+
}
164+
return code;
165+
166+
}//rollup
167+
168+
169+
}//start
170+
171+
172+
//:
173+
174+
175+
files['package.json'] = `
176+
177+
{
178+
"name": "node-test",
179+
"version": "1.0.0",
180+
"scripts": {}
181+
}
182+
183+
`;
184+
185+
186+
files['rollup.config.js'] = `
187+
188+
import resolve from '@rollup/plugin-node-resolve';
189+
import commonjs from '@rollup/plugin-commonjs';
190+
import json from '@rollup/plugin-json';
191+
import nodePolyfills from 'rollup-plugin-polyfill-node';
192+
193+
export default {
194+
input : 'entry.js',
195+
output : {
196+
file : '${filename}',
197+
format : 'es'
198+
199+
//format : 'iife', // or 'umd'
200+
//name : 'espree', // This becomes window.espree
201+
//exports : 'default',
202+
203+
},
204+
plugins : [
205+
commonjs(),
206+
json(),
207+
nodePolyfills(),
208+
resolve({preferBuiltins:false})
209+
]
210+
};
211+
212+
`;
213+
214+
215+
216+
217+
})();
218+
219+
220+
</script>
221+
222+
223+

0 commit comments

Comments
 (0)