feat: support vuepress v2

README-zh_CN.md

@@ -110,7 +110,6 @@ module.exports = {
         embed: '',
       },
       demoCodeMark: 'demo-code',
-      copyOptions: { ... },
     }]
   ],
 }
@@ -178,12 +177,6 @@ vue 的语义化版本字符串。想要了解更多的语义化版本格式，
 
 插件的标记，即跟在 `:::` 后的标记。
 
-### copyOptions
-* 类型：`Object/Boolean`
-* 默认值：`{ align: 'top', selector: '.demo-and-code-wrapper div[class*="language-"] pre' }`
-
-透传 [vuepress-plugin-code-copy](https://github.com/znicholasbrown/vuepress-plugin-code-copy#options) 的参数，或传 `false` 禁用它。
-
 ## Related
 * [vuepress-plugin-demo-block](https://github.com/xiguaxigua/vuepress-plugin-demo-block)
 

README.md

@@ -110,7 +110,6 @@ module.exports = {
         embed: '',
       },
       demoCodeMark: 'demo-code',
-      copyOptions: { ... },
     }]
   ],
 }
@@ -178,12 +177,6 @@ It passes [CodeSandbox options](https://codesandbox.io/docs/importing#define-api
 
 The mark of the plugin, follows the tag after `:::`.
 
-### copyOptions
-* Type: `Object/Boolean`
-* Default: `{ align: 'top', selector: '.demo-and-code-wrapper div[class*="language-"] pre' }`
-
-It passes [vuepress-plugin-code-copy](https://github.com/znicholasbrown/vuepress-plugin-code-copy#options)'s options, or `false` to disable it.
-
 ## Related
 * [vuepress-plugin-demo-block](https://github.com/xiguaxigua/vuepress-plugin-demo-block)
 

docs/.vuepress/config.ts

@@ -0,0 +1,85 @@
+import { defineUserConfig } from 'vuepress'
+import searchPlugin from '@vuepress/plugin-search'
+import { defaultTheme } from '@vuepress/theme-default'
+import smoothScrollPlugin from 'vuepress-plugin-smooth-scroll'
+
+import includePlugin from './include-plugin'
+import { demoCodePlugin } from '../../src/node'
+import { name, description } from '../../package.json'
+
+const ecosystemItems = [
+  { text: '📖markdown-it-vuese', link: 'https://buptsteve.github.io/markdown-it-vuese/' },
+]
+
+export default defineUserConfig({
+  base: `/${name}/`,
+  locales: {
+    '/': { lang: 'en-US', title: 'demo-code', description },
+    '/zh/': {
+      lang: 'zh-CN',
+      title: 'demo-code',
+      description: '📝 同时展示 demo 和 code 的 vuepress 插件',
+    },
+  },
+  head: [
+    ['link', { rel: 'icon', href: '/favicon.ico' }],
+    ['link', { rel: 'stylesheet', href: 'https://unpkg.com/[email protected]/animate.min.css' }],
+  ],
+  plugins: [
+    includePlugin,
+    // @ts-ignore
+    smoothScrollPlugin,
+    demoCodePlugin({
+      cssLibs: [
+        'https://unpkg.com/[email protected]/animate.min.css',
+      ],
+      showText: 'show more',
+      hideText: 'hide',
+    }),
+    searchPlugin({
+      locales: {
+        '/': {
+          placeholder: 'Search',
+        },
+        '/zh/': {
+          placeholder: '搜索',
+        },
+      },
+    }),
+  ],
+  theme: defaultTheme({
+    repo: 'BuptStEve/' + name,
+    docsDir: 'docs',
+    contributors: false,
+    locales: {
+      '/': {
+        selectLanguageText: '🌍Languages',
+        selectLanguageName: 'English',
+        editLinkText: 'Edit this page on GitHub',
+        navbar: [
+          { text: '🌱Guide', link: '/' },
+          { text: '😎Example', link: '/example/' },
+          { text: '🔥Ecosystem', children: ecosystemItems },
+        ],
+        sidebar: [
+          { text: '🌱Guide', link: '/' },
+          { text: '😎Example', link: '/example/' },
+        ],
+      },
+      '/zh/': {
+        selectLanguageText: '🌍选择语言',
+        selectLanguageName: '简体中文',
+        editLinkText: '在 GitHub 上编辑此页',
+        navbar: [
+          { text: '🌱指南', link: '/zh/' },
+          { text: '😎示例', link: '/zh/example/' },
+          { text: '🔥生态系统', children: ecosystemItems },
+        ],
+        sidebar: [
+          { text: '🌱指南', link: '/zh/' },
+          { text: '😎示例', link: '/zh/example/' },
+        ],
+      },
+    },
+  }),
+})

docs/.vuepress/include-plugin.js

@@ -0,0 +1,13 @@
+
+module.exports = () => {
+  return {
+    name: 'vuepress-plugin-include',
+    extendsMarkdown: (md) => {
+      md.use(require('markdown-it-include'), {
+        root: './docs/',
+        includeRe: /<\[include\](.+)/i,
+        bracesAreOptional: true,
+      })
+    },
+  }
+}

docs/zh/example/README.md

@@ -8,20 +8,20 @@
 ```md
 ::: demo
 <template>
-    <button class="animated shake infinite" @click="onClick">Click me!</button>
+  <button class="animated shake infinite" @click="onClick">Click me!</button>
 </template>
 
 <script>
 export default {
-    methods: {
-        onClick: () => { window.alert(1) },
-    },
+  methods: {
+    onClick: () => { window.alert(1) },
+  },
 }
 </script>
 
 <style>
 button {
-    color: blue;
+  color: blue;
 }
 </style>
 :::
@@ -31,20 +31,20 @@ button {
 
 ::: demo
 <template>
-    <button class="animated shake infinite" @click="onClick">Click me!</button>
+  <button class="animated shake infinite" @click="onClick">Click me!</button>
 </template>
 
 <script>
 export default {
-    methods: {
-        onClick: () => { window.alert(1) },
-    },
+  methods: {
+    onClick: () => { window.alert(1) },
+  },
 }
 </script>
 
 <style>
 button {
-    color: blue;
+  color: blue;
 }
 </style>
 :::
@@ -57,12 +57,12 @@ button {
 ```md
 ::: demo html
 <p class="common-html">
-    this is <span style="color: red;">common</span> html
+  this is <span style="color: red;">common</span> html
 </p>
 
 <style>
 .common-html {
-    color: green;
+  color: green;
 }
 </style>
 :::
@@ -72,12 +72,12 @@ button {
 
 ::: demo html
 <p class="common-html">
-    this is <span style="color: red;">common</span> html
+  this is <span style="color: red;">common</span> html
 </p>
 
 <style>
 .common-html {
-    color: green;
+  color: green;
 }
 </style>
 :::

jest.config.js

@@ -5,13 +5,13 @@ module.exports = {
   collectCoverage: true,
   collectCoverageFrom: [
     'src/**',
-    '!src/icons/**',
-    '!src/highlight.js',
-    '!src/enhanceAppFile.js',
+    '!src/client/icons/**',
+    '!src/client/highlight.js',
+    '!src/client/enhanceAppFile.js',
   ],
   coveragePathIgnorePatterns: ['/__snapshots__/'],
   transform: {
-    '^.+\\.vue$': 'vue-jest',
+    '^.+\\.vue$': '@vue/vue3-jest',
     '^.+\\.jsx?$': 'babel-jest',
     '.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
   },