vite-plugin-markdown icon indicating copy to clipboard operation
vite-plugin-markdown copied to clipboard

use vite3+vue3,not support require('vite-plugin-markdown')

Open codevvvv9 opened this issue 3 years ago • 2 comments

vite.config.ts is:

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
const mdPlugin = require('vite-plugin-markdown') // 需要通过commenJs方式引用

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    mdPlugin.plugin({
      mode: ['html'],
    })
  ],
  base: './'
})

but npm run dev get error - Dynamic require of "vite-plugin-markdown" is not supported:

failed to load config from /Users/wushao/wushaoDev/FE-stuty/vue3-demo/vite.config.ts
error when starting dev server:
Error: Dynamic require of "vite-plugin-markdown" is not supported
    at file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/vite.config.ts.timestamp-1663848973291.mjs:6:9
    at file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/vite.config.ts.timestamp-1663848973291.mjs:12:16
    at ModuleJob.run (node:internal/modules/esm/module_job:193:25)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:533:24)
    at async loadConfigFromBundledFile (file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/node_modules/vite/dist/node/chunks/dep-557f29e6.js:63494:21)
    at async loadConfigFromFile (file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/node_modules/vite/dist/node/chunks/dep-557f29e6.js:63380:28)
    at async resolveConfig (file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/node_modules/vite/dist/node/chunks/dep-557f29e6.js:62997:28)
    at async createServer (file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/node_modules/vite/dist/node/chunks/dep-557f29e6.js:62063:20)
    at async CAC.<anonymous> (file:///Users/wushao/wushaoDev/FE-stuty/vue3-demo/node_modules/vite/dist/node/cli.js:700:24)

codevvvv9 avatar Sep 22 '22 12:09 codevvvv9

Register it correctly.

import { defineConfig } from 'vite';
import mdPlugin, {Mode} from 'vite-plugin-markdown';

export default defineConfig({
    plugins: [
        mdPlugin({ mode: [Mode.HTML, Mode.TOC, Mode.VUE] })
    ],
});

MLDMoritz avatar Oct 30 '22 14:10 MLDMoritz

I tried that, but I got an error: TypeError: mdPlugin is not a function. (Version 2.1.0)

console.log(mdPlugin) shows it as

{
  Mode: { TOC: 'toc', HTML: 'html', REACT: 'react', VUE: 'vue' },
  plugin: [Function: plugin],
  default: [Function: plugin]
}

Changing the import to

import {plugin as mdPlugin, Mode} from 'vite-plugin-markdown';

fixed it for me. I don't understand what is wrong there, though.

MaPePeR avatar Dec 29 '22 11:12 MaPePeR