feat: better markdown support #5366
Conversation
Jarsen136
requested review from
preschian and
vikiival
and removed request for
a team
|
SUCCESS @Jarsen136 PR for issue #5361 which is assigned to you. Please wait for review and don't hesitate to grab another issue in the meantime! |
✅ Deploy Preview for koda-nuxt ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
|
New dependency changes detected. Learn more about Socket for GitHub ↗︎ 🚨 Potential security issues found in this pull request. To accept the risk, merge this PR and you will not be notified again. Bot CommandsTo ignore an alert, reply with a comment starting with
📜 Install scriptsInstall scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts. Packages should not be running non-essential scripts during install and there are often solutions to problems people solve with install scripts that can be run at publish time instead. 🍣 Git dependencyContains a dependency which resolves to a remote git URL. Dependencies fetched from git URLs are not immutable can be used to inject untrusted code or reduce the likelihood of a reproducible install. Publish the git dependency to npm or a private package repository and consume it from there.
Pull request alert summary
📊 Modified Dependency Overview:
🚮 Removed packages: [email protected], [email protected], [email protected], [email protected], [email protected] |
Sorry, I do know this package before. I'm also not sure if it could support as much custom functionality as provided by |
|
|
|
cc @yangwao can you please add us to snyk? |
|
Looks like this was opened week ago. cc @preschian @roiLeo do we proceed or closing this? |
sent invite link, i was looking something different for snyk as their builds was not so sometimes ok and when they found some critical vuln they did not have it logs so itchy sketchy sometime |
|
socket security > snyk actually (yet it's spamming bit to PRs :/) |
|
|
|
this one is high severity and real deal https://security.snyk.io/vuln/SNYK-JS-MARKDOWNITKATEX-597160 |
|
I'm ok here with it to take this one. - Also option is sanitze things, so XSS can't be executed
|
Oh, I got it. Let me try to remove this package |
that's also way for it I guess! :) |
![codeclimate[bot]](https://avatars.githubusercontent.com/in/9403?s=60&v=4){kind=small}
|
maybe try to transform markdown content with this package? https://mdxjs.com/ |
After some research, I found mdxjs is a good markdown content previewer to use on React, but not on Vue. It only supports |
|
Eventually, it works as expected : ) This solution is here: miaolz123/vue-markdown#112 I use For now, the snyk shows that there are three warning issue. I have overwritten these unsafe packages by the ones with safe version. So I think it's good to go now.
overwrite unsafe package: |
|
So why is snyk failing? |
|
Also option is to fork the package and update it inside? |
|
Code Climate has analyzed commit 9b6dc63 and detected 0 issues on this pull request. View more on Code Climate. |
I have mentioned the reason on the above comment. It's because snyk is not intelligent enough to know we have overwritten the package to the safe version. The snyk reports show that both
I think yes. I would choose the forked package |
| </template> | ||
|
|
||
| <script lang="ts" setup> | ||
| import VueMarkdown from 'vue-markdown-v2' |
There was a problem hiding this comment.
I think we can still use vue-markdown-render. that package support vue3 starting on v2 https://github.com/cloudacy/vue-markdown-render/releases/tag/v2.0.0. because vue-markdown-v2 was a bit outdated 4 years ago
I test it by changing it to this seems works:
<template>
<vue-markdown :source="source" :options="options" />
</template>
<script lang="ts" setup>
import VueMarkdown from 'vue-markdown-render'
import hljs from 'highlight.js'
const props = defineProps<{
source: string
highlight?: boolean
}>()
const options = computed(() => {
const defaultOptions = {
html: true,
linkify: true,
typographer: true,
}
if (props.highlight) {
return {
...defaultOptions,
highlight: (code: string, lang: string) => {
if (lang && hljs.getLanguage(lang)) {
try {
return hljs.highlight(lang, code).value
} catch (error) {
console.error(error)
}
}
return hljs.highlightAuto(code).value
},
}
}
return defaultOptions
})
</script>
There was a problem hiding this comment.
Thanks. I will take a try later
|
Hey, I am considering to close this PR and make a new one. WDYT @Jarsen136 @preschian ? |
OK, Let's close it. And I will raise a new PR soon |
Thank you for your contribution to the KodaDot NFT gallery.
👇 _ Let's make a quick check before the contribution.
PR Type
Context
Before submitting pull request, please make sure:
Optional
Had issue bounty label?
Community participation
Screenshot 📸
`/rmrk2/gallery/13898634-b46a62619cb12c7a15-LUM-A-G-0443_514_MB_GREGORY_THE_ILLUMINATOR-00000443`