Skip to content

Instantly share code, notes, and snippets.

@cjholowatyj
Created January 12, 2024 21:59
Show Gist options
  • Save cjholowatyj/2b6a524f9777209f5872708028d92111 to your computer and use it in GitHub Desktop.
Save cjholowatyj/2b6a524f9777209f5872708028d92111 to your computer and use it in GitHub Desktop.
Trying to use `unplugin-vue-components` with Vite/InertiaSSR...
import MarkdownItAnchor from 'markdown-it-anchor';
import MarkdownItAttrs from 'markdown-it-attrs';
import MarkdownItCodeCopy from 'markdown-it-code-copy';
import MarkdownItHighlightJs from 'markdown-it-highlightjs';
import MarkdownItSup from 'markdown-it-sup';
import Components from 'unplugin-vue-components/vite';
import Markdown from 'unplugin-vue-markdown/vite';
import {defineConfig, loadEnv} from 'vite';
/** @type {import('vite').UserConfig} */
export default defineConfig({
build: {},
plugins: [
Markdown({
markdownItOptions: {
html: true,
linkify: true,
typographer: true
},
markdownItSetup: (md) => {
md
.use(MarkdownItAnchor, {
permalink: MarkdownItAnchor.permalink['linkInsideHeader']({
class: 'text-decoration-none hover:underline hover:underline-offset-4'
/*assistiveText: (title:string) => `Permalink to “${title}”`,*/
/*visuallyHiddenClass: 'hidden'*/
})
})
.use(MarkdownItAttrs)
.use(MarkdownItCodeCopy)
.use(MarkdownItHighlightJs)
.use(MarkdownItSup);
},
wrapperClasses: 'markdown-body'
}),
Components({
dirs: ['./flighter/resources/md/'],
dts: true,
// allow autoloading markdown components under `./src/components/`
extensions: ['vue', 'md'],
// allow auto import and register components used in markdown
//customLoaderMatcher: (path:any):any => (path.endsWith('.md') as any),
include: [/\.vue$/, /\.md$/],
resolvers: [
(componentName:string) => {
// where `componentName` is always CapitalCase
if (componentName.startsWith('Flighter'))
return {name: componentName.slice(8), from: '@flighter/js'};
}
],
version: 3
}),
],
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment