search

arielsalminen / vue-design-system

An open source tool for building UI Design Systems with Vue.js
https://vueds.com
MIT License
2.17k stars 224 forks source link

Code blocks in Markdown get actually rendered when wrapping them using ```html ... ``` #135

Closed sdellis closed 5 years ago

sdellis commented 5 years ago

In the /config/docs.config.js file, when exampleMode and usageMode are set to "collapse" the "Vue|HTML" toggle should not display. Here is an example of a custom .md file that I've added.

...
    {
      name: "How to Install",
      content: "../docs/how-to-install.md",
      exampleMode: "collapse",
      usageMode: "collapse",
      sectionDepth: 1,
    },
...
screen shot 2018-10-31 at 2 22 59 pm
sdellis commented 5 years ago

I should mention that in a previous version of VueDS one was able to add codeblocks that did not try to render by wrapping them in ```html. That was helpful for providing installation instructions and other code samples in the docs (that have nothing to do with the components) without having it try to render the code. That is what I'm trying to achieve here, but no matter what I do, I'm not able to include a code block that has JavaScript in it without the system trying to evaluate it. Is this a problem with Vue Styleguidist?

arielsalminen commented 5 years ago

@sdellis hmm. let me dig into this. You’re correct that it should be hidden, but probably currently something that isn’t implemented on vueds side.

As for the other matter you mention in the second comment, I’m not sure yet what’s happening there. That should be possible, so need to look into this as well.

arielsalminen commented 5 years ago

@sdellis html code blocks don’t seem to be working currently and your original issue is related to that. I think this might be a vue styleguidist issue, but not sure yet. This works:

    ```javascript
         something

but this seems to cause things to actually render on page and throw vue related errors:

```html
     <template>something</template>
```
arielsalminen commented 5 years ago

@rafaesc Would you have any clue on what’s going on?

arielsalminen commented 5 years ago

@sdellis Edited the title accordingly since I think that is the causing the tab issue as well.

arielsalminen commented 5 years ago

@sdellis I’ve created an issue on Styleguidist side about this: https://github.com/vue-styleguidist/vue-styleguidist/issues/234

sdellis commented 5 years ago

@viljamis Thank you! Should we leave this issue open until it gets resolved?

arielsalminen commented 5 years ago

@sdellis looks like there is a fix now in Styleguidist. If you want you can just update the version in your package.json, but please leave this open for now. I’ll make a new release soon with this and a few other fixes.

arielsalminen commented 5 years ago

Fixed in 3.5.7