docsifyjs / docsify

🃏 A magical documentation site generator.

Home Page:https://docsify.js.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

docsify-vue-no-additional-configuration-issue

ezzle opened this issue · comments

Bug Report

docsify-vue-no-additional-configuration-issue

Vue template syntax is used to create dynamic content. With no additional configuration, this syntax offers several useful features like support for JavaScript expressions and Vue directives for loops and conditional rendering.

Not working when missing vueGlobalOptions configuration. Even an empty one is ok. At least An empty vueGlobalOptions config required ?

Steps to reproduce

https://stackblitz.com/edit/stackblitz-starters-zex4gj?file=docs%2Findex.html

COMMENT the vueGlobalOptions to test the issue

Current behaviour

Not working when missing at least an empty vueGlobalOptions

Expected behaviour

Working with no vue configuration. What I understand from the documention

Other relevant information

  • Docsify version: the latest
  • Bug still occurs when all/other plugins are disabled?

  • Docsify plugins (if the bug happens when plugins enabled, please try to isolate the issue):

Please create a reproducible sandbox

Edit 307qqv236

Mention the docsify version in which this bug was not present (if any)

Hi @ezzle , thx for catching the point.
It needs enhancement in our side here to parse Vue content automatically once user import Vue resources, although without define any Vue contexts (components, configs).

Please can you also clarify how to use Vue3.x to

  1. declare an component
  2. import, register and use vue component defined in an external SFC .vue component

Please can you also clarify how to use Vue3.x to

  1. declare an component
  2. import, register and use vue component defined in an external SFC .vue component

Hi @ezzle , you could declare an component like this below, more in our docsify docs.

window.$docsify = {
  vueComponents: {
    'button-counter': {
      template: `
        <button @click="count += 1">
          You clicked me {{ count }} times
        </button>
      `,
      data() {
        return {
          count: 0,
        };
      },
    },
  },
};

Unfortunately, import and use the 3rd vue component is not that feasible based on our Vue supports tho.