Skip to content

Expect to support template file configuration #195

Closed
@JinweiOS

Description

@JinweiOS

Situation

First of all, I would like to thank Vue's huge community for bringing great convenience to my development.
Well, starting from my scene, I want to use sfc playground to develop echarts charts, and hope that the echarts sample code will be displayed by default when the user opens the playground for the first time. But currently @vue/repl does not seem to directly support this scenario.

Here is some pseudocode.

// init store
const store = new ReplStore(...)

// set echarts import map
store.setImportMap({
  imports: {
    "echarts": "https://cdn.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.esm.js",
    "vue": "https://play.vuejs.org/vue.runtime.esm-browser.prod.js",
    "vue/server-renderer": "https://play.vuejs.org/server-renderer.esm-browser.js"
  }
})

// todo: set welcome code
store.setFiles({ 'App.vue', welcomeRawCode})

If written like this, compileFile will be executed immediately inside the setFiles function. At this time, echarts library has not been loaded yet, and an error will be reported.

There is another way to complete the initialization through persistent url code, but if the welcome code changes frequently, the DX will be poor.

const store = new ReplStore({
  serializedState: urlCode, // If the welcome code template changes, this place needs to be regenerated.
});

Expect

So, I would like to ask if @vue/repl can support welcomeCode and newSFCCode template customization, which can be provided through ReplStore initialization or a static method.
If PR is welcome, I can try to initiate one!😊
There is a PR.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions