Sooner than later I will render forum discussions in Vue.js to complement the standard way of showing forum threads.
Today, I ran across this component, vue-code-highlight
Beautiful code syntax highlighting as Vue.js component.
Usage
We can use this module in two different ways, as a component or as a directive.
Component
HTML
Window styles are already present in a component mode, but we will need to select and include a theme to properly highlight code. (See the themes section.)
Directive
In the main file:
And then in any Vue component:
HTML
All markup under the div element having the following structure will be syntax highlighted.
HTML
To give the highlighter a window look in a directive mode, include the ./node_modules/vue-code-highlight/themes/window.css file somewhere in the app.
Themes
In order to visually highlight code, we need to select a theme from ./node_modules/vue-code-highlight/themes/ and import it somewhere into the component/application.
Hello Everybody
I recently got this beautiful shell script from my friend. I like to share it with every body as I am bit new to shell scripting enviorment. I hope people in this site will like it. It is related to checking the filesystem threshold limit. After getting threshold limit of... (0 Replies)
A shout out to Scott who gave me a helping hand to turn a simple sample Vue.js app I wrote yesterday into a Vue.js component:
Vue.component("unix-time", {
template: `<div class="time">{{unixtime}}</div>`,
data() {
return {
unixtime: ""
};
},
methods: {
... (1 Reply)
The following is some code I am working on the replace our navbar (someday) with a Vue component.
Vue.component("unix-navbar", {
template: `<div class="neo-table-border vuenavbar"><div class="flex-item" style="margin-bottom:10px;padding-top:13px;"><a class="vuenavbarhome"... (19 Replies)
Vue Router has some quirks and on of the quirks is that it is not reliable when adding external links using the vue-router library.
After struggling with many solutions, I have found that creating a simple Vue.js component like this one seems to work the best (so far):
Component Example: ... (0 Replies)
A number of people have asked me how to get started with Vue.js and my reply before today was to Google "Vue.js". That has changed and my recommendation to anyone who wants to learn the fastest growing, easiest to learn and use Vue.js web dev framework is to watch this video tutorial series:
... (0 Replies)