• Phil Hughes's avatar
    Web IDE & CodeSandbox · 7b4b9e1c
    Phil Hughes authored
    This enables JavaScripts projects to have live previews straight in the
    browser without requiring any local configuration. This uses the
    CodeSandbox package `sandpack` to compile it all inside of an iframe.
    
    This feature is off by default and can be toggled on in the admin
    settings. Only projects with a `package.json` and a `main` key are
    supported.
    
    Updates happen in real-time with hot-reloading. We just watch for
    changes to files and then send them to `sandpack` to allow it to reload
    the iframe. The iframe includes a very simple navigation bar, the text
    bar is `readonly` to stop users navigating away from the preview and
    the back and forward buttons just pop/splice the navigation stack
    which is tracked by a listener on `sandpack`
    
    There is a button inside the iframe which allows the user to open the
    projects inside of CodeSandbox. This button is only visible on
    **public** projects. On private or internal projects this button
    get hidden to protect private code being leaked into an external
    public URL.
    
    Closes #47268
    7b4b9e1c
right.vue 3.52 KB