You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: packages/codesandbox-playground/README.md
+16-13Lines changed: 16 additions & 13 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,11 +8,11 @@ Online code playgrounds are getting more popular: they provide an easy way to pl
8
8
9
9
CodeSandbox came along, and still had a pretty basic bundler. However, as CodeSandbox got more popular its bundler got more advanced. Nowadays the bundler has comparable parity with Webpack, and it would be a shame if others couldn't use the functionality.
10
10
11
-
This library acts as an interface with the bundler of CodeSandbox. It allows you to run any code on a web page, from Vue projects to React projects.
11
+
This library acts as an interface with the bundler of CodeSandbox. It allows you to run any code on a web page, from Vue projects to React projects. With everything that CodeSandbox supports as well.
12
12
13
13
## So what can the bundler do?
14
14
15
-
This is a list of features that the bundler supports, it may be outdated.
15
+
This is a list of features that the bundler supports, the list may be outdated.
16
16
17
17
1. Hot Module Reloading API (`module.hot`).
18
18
2. npm dependencies
@@ -33,15 +33,18 @@ The Manager is a plain JavaScript implementation, you can use it by importing Ma
33
33
import { Manager } from'codesandbox-playground';
34
34
35
35
// Let's say you want to show the preview on #preview
36
-
constm=newManager('#app', {
37
-
files: {
38
-
'/index.js':`console.log(require('uuid'))`,
39
-
},
40
-
dependencies: {
41
-
uuid:'latest',
42
-
},
43
-
entry:'/index.js',
44
-
});
36
+
constm=newManager(
37
+
'#app',
38
+
{
39
+
files: {
40
+
'/index.js':`console.log(require('uuid'))`,
41
+
},
42
+
dependencies: {
43
+
uuid:'latest',
44
+
},
45
+
entry:'/index.js',
46
+
} /* you can give a third argument with extra options, described at the bottom */
47
+
);
45
48
46
49
// This will show the preview on the #preview element, you can now send new code
47
50
// by calling 'sendCode(files, dependencies, entry)'. We will automatically determine
@@ -59,7 +62,7 @@ m.sendCode(
59
62
60
63
### As a React Component
61
64
62
-
We included a React component you can use, implementation is fairly simple.
65
+
We included a React component you can use, the implementation is fairly simple.
0 commit comments