feat: Vuepress 2 support

tomatopickle commented 2 years ago

Is your feature request related to a problem? Please describe. I really like this plugin, but I've switched to Vuepress 2. Can you please make this plugin Vuepress 2 compatible?

Thanks

BuptStEve commented 2 years ago

OK, I'll try it...

$ npm i -D vuepress-plugin-demo-code@next
# OR
$ pnpm i -D vuepress-plugin-demo-code@next
# OR
$ yarn add -D vuepress-plugin-demo-code@next

tomatopickle commented 2 years ago

Does this support Vuepress 2 now?

BuptStEve commented 2 years ago

Does this support Vuepress 2 now?

Yeah, try this one~

$ npm i -D vuepress-plugin-demo-code@next
# OR
$ yarn add -D vuepress-plugin-demo-code@next

jtommy commented 2 years ago

@BuptStEve it doesn't work properly, is it a stable version?

BuptStEve commented 2 years ago

@BuptStEve it doesn't work properly, is it a stable version?

what's wrong with it? Please provide some pictures or a demo? It's not a stable version, because vuepress@2 is in beta version.

jtommy commented 2 years ago

@BuptStEve The path separator doesn't look good for windows OS

 Plugin: vite:import-analysis
  File: C:/Users/Walter/Github/oruga/packages/docs-next/.vuepress/.temp/internal/clientAppEnhances.js
  3  |  import clientAppEnhance2 from 'C:/Users/Walter/Github/oruga/packages/docs-next/node_modules/@vuepress/plugin-theme-data/lib/client/clientAppEnhance.js'
  4  |  import clientAppEnhance3 from 'C:/Users/Walter/Github/oruga/packages/docs-next/node_modules/@vuepress/theme-default/lib/client/clientAppEnhance.js'
  5  |  import clientAppEnhance4 from 'C:\Users\Walter\Github\oruga\packages\docs-next\node_modules\vuepress-plugin-demo-code\src\enhanceAppFile.js'     
     |                                 ^
  6  |  import clientAppEnhance5 from 'C:/Users/Walter/Github/oruga/packages/docs-next/.vuepress/clientAppEnhance.ts'

and fiixing it manually

BuptStEve commented 2 years ago

@jtommy Well, I get it. I'll fix this ASAP. Because there are too many breaking changes in Vuepress's beta version, such as this:

jtommy commented 2 years ago

Thanks. What Vuepress 2 version are you supporting at the moment?

BuptStEve commented 2 years ago

@jtommy 2.0.0-beta.27

I just make it compatible with 2.0.0-beta.37, please wait a moment.

Please try this one~ vuepress-plugin-demo-code@1.0.0-2

jtommy commented 2 years ago

@BuptStEve 2.0.0-beta.38

Uncaught SyntaxError: The requested module '/@fs/C:/Users/Walter/Github/oruga/packages/docs-next/node_modules/codesandbox-import-utils/lib/api/define.js' does not provide an export named 'getParameters'

SyntaxError: The requested module '/@fs/C:/Users/Walter/Github/oruga/packages/docs-next/node_modules/escape-html/index.js' does not provide an export named 'default' (at highlight.js:2:8)

It looks like all import from external libs are broken, probably due to Vite

BuptStEve commented 2 years ago

@jtommy Maybe add this for now~

// config.js
{
  // ...
  bundlerConfig: {
    viteOptions: {
        optimizeDeps: {
            include: [
                'prismjs',
                'escape-html',
                'codesandbox-import-utils/lib/api/define'
            ],
        }
    }
  }
}

BuptStEve commented 2 years ago

@jtommy I just publish this version: vuepress-plugin-demo-code@1.0.0-3

jtommy commented 2 years ago

@BuptStEve thanks. I found the same workaround after my last message. Your last version is ok but you are setting Vue 2, why?

Anyway, I don't think I to be able to use your plugin because in the Vuepress 2.x there is a limit of a script for each .md

BuptStEve commented 2 years ago

@jtommy I'll use Vue3 as default in next commit. It's fine that you won't use it, every package suits it's own scenario.

jtommy commented 2 years ago

Or you might add a config to allow us to customize the Vue CDN.

I think the major part of components doc needs to show more than one example for each page (.MD).

BuptStEve commented 2 years ago

@jtommy vuepress-plugin-demo-code@1.0.0-4 add vueVersion~ The feature "more than one <script>" is not that easy with current code.