feat: basic function

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintrc.js

@@ -0,0 +1,9 @@
+module.exports = {
+    extends: 'standard',
+    parser: 'babel-eslint',
+    rules: {
+        'indent': [2, 4],
+        'promise/param-names': 0,
+        'comma-dangle': [2, 'always-multiline'],
+    },
+}

.gitignore

@@ -0,0 +1,8 @@
+dist
+*.log
+coverage
+.DS_Store
+node_modules
+docs/.vuepress/dist/
+
+yarn.lock

.npmignore

@@ -0,0 +1,5 @@
+test
+*.log
+coverage
+.circleci
+docs/.vuepress/dist

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) StEve Young
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,46 @@
+<h1 align="center">vuepress-plugin-demo-code</h1>
+
+> demo-code plugin for vuepress.
+
+借助这个插件，你可以通过下述的语法在展示 demo 的同时，将这段代码展示出来。
+
+```md
+::: demo
+<div @click="onClick">Click me!</div>
+
+<script>
+export default {
+    methods: {
+        onClick: () => { window.alert(1) },
+    },
+}
+</script>
+:::
+```
+
+## Install
+
+* 首先安装 [vuepress v1.x](https://github.com/vuejs/vuepress)
+
+* 接着安装插件
+
+```bash
+$ npm i -D vuepress-plugin-demo-code
+# OR
+$ yarn add -D vuepress-plugin-demo-code
+```
+
+## Usage
+配置 vuepress config
+
+```js
+module.exports = {
+    plugins: ['demo-code'],
+}
+```
+
+## License
+
+[MIT](http://opensource.org/licenses/MIT)
+
+Copyright (c) StEve Young

commitlint.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+    // https://www.npmjs.com/package/@commitlint/config-conventional
+    extends: ['@commitlint/config-conventional'],
+    "rules": {
+    },
+}

docs/.vuepress/config.js

@@ -0,0 +1,41 @@
+const demoCode = require('../../src/')
+const { name, description } = require('../../package.json')
+
+module.exports = {
+    base: '/' + name + '/',
+    locales: {
+        '/': { title: name, description },
+    },
+    head: [
+        ['link', { rel: 'icon', href: `/favicon.ico` }],
+    ],
+    plugins: [demoCode],
+    evergreen: true,
+    serviceWorker: true,
+    themeConfig: {
+        repo: 'BuptStEve/' + name,
+        docsDir: 'docs',
+        nav: [
+            { text: 'Guide', link: '/' },
+            { text: 'Example', link: '/example/' },
+        ],
+        sidebar: {
+            '/example/': [{
+                title: 'Example',
+                collapsable: false,
+                children: [
+                    '',
+                ],
+            }],
+            '/': [['', 'Guide']],
+        },
+        sidebarDepth: 2,
+        editLinks: true,
+        serviceWorker: {
+            updatePopup: {
+               message: 'New content is available.',
+               buttonText: 'Refresh',
+            },
+        },
+    },
+}

docs/README.md

@@ -0,0 +1,46 @@
+<h1 align="center">vuepress-plugin-demo-code</h1>
+
+> demo-code plugin for vuepress.
+
+借助这个插件，你可以通过下述的语法在展示 demo 的同时，将这段代码展示出来。
+
+```md
+::: demo
+<div @click="onClick">Click me!</div>
+
+<script>
+export default {
+    methods: {
+        onClick: () => { window.alert(1) },
+    },
+}
+</script>
+:::
+```
+
+## Install
+
+* 首先安装 [vuepress v1.x](https://github.com/vuejs/vuepress)
+
+* 接着安装插件
+
+```bash
+$ npm i -D vuepress-plugin-demo-code
+# OR
+$ yarn add -D vuepress-plugin-demo-code
+```
+
+## Usage
+配置 vuepress config
+
+```js
+module.exports = {
+    plugins: ['demo-code'],
+}
+```
+
+## License
+
+[MIT](http://opensource.org/licenses/MIT)
+
+Copyright (c) StEve Young

docs/example/README.md

@@ -0,0 +1,59 @@
+# Eaxmple
+
+## 常规操作
+直接把 demo 代码用 `::: demo` 和 `:::` 包裹。即可生成可运行的 demo 和代码。
+
+### 使用示例
+
+```md
+::: demo
+<template>
+    <button @click="onClick">Click me!</button>
+</template>
+
+<script>
+export default {
+    methods: {
+        onClick: () => { window.alert(1) },
+    },
+}
+</script>
+:::
+```
+
+### 实现效果
+
+::: demo
+<template>
+    <button @click="onClick">Click me!</button>
+</template>
+
+<script>
+export default {
+    methods: {
+        onClick: () => { window.alert(1) },
+    },
+}
+</script>
+:::
+
+## 修改语言
+你可能注意到了展示代码右上角显示了 `vue`，这里的语言可配置。（默认为 `vue`）
+
+### 使用示例
+
+```md
+::: demo html
+<p>
+    this is <span style="color: red;">common</span> html
+</p>
+:::
+```
+
+### 实现效果
+
+::: demo html
+<p>
+    this is <span style="color: red;">common</span> html
+</p>
+:::

package.json

@@ -0,0 +1,79 @@
+{
+    "name": "vuepress-plugin-demo-code",
+    "version": "0.1.0",
+    "description": "Demo and code plugin for vuepress",
+    "main": "src/index.js",
+    "scripts": {
+        "docs": "vuepress dev docs --host localhost",
+        "docs:build": "vuepress build docs",
+        "cov": "open coverage/lcov-report/index.html",
+        "tdd": "cross-env NODE_ENV=test jest --watch",
+        "test": "cross-env NODE_ENV=test jest",
+        "lint": "eslint --fix src/ test/",
+        "deploy": "yarn docs:build && gh-pages -m \"[ci skip]\" -d docs/.vuepress/dist",
+        "pub": "npm publish"
+    },
+    "husky": {
+        "hooks": {
+            "pre-push": "lint-staged",
+            "pre-commit": "lint-staged",
+            "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+        }
+    },
+    "lint-staged": {
+        "{src,test}/**/*.js": [
+            "eslint --fix",
+            "git add"
+        ]
+    },
+    "jest": {
+        "bail": true,
+        "clearMocks": true,
+        "transform": {
+            "^.+\\.js$": "babel-jest"
+        },
+        "collectCoverage": true,
+        "collectCoverageFrom": [
+            "src/**"
+        ]
+    },
+    "dependencies": {
+        "@vuepress/shared-utils": "^1.0.0-alpha.32",
+        "markdown-it-container": "^2.0.0",
+        "prismjs": "^1.15.0"
+    },
+    "devDependencies": {
+        "@commitlint/cli": "^7.3.2",
+        "@commitlint/config-conventional": "^7.3.1",
+        "babel-eslint": "^10.0.1",
+        "codecov": "^3.1.0",
+        "cross-env": "^5.2.0",
+        "eslint": "^5.12.1",
+        "eslint-config-standard": "^12.0.0",
+        "eslint-plugin-import": "^2.15.0",
+        "eslint-plugin-node": "^8.0.1",
+        "eslint-plugin-promise": "^4.0.1",
+        "eslint-plugin-standard": "^4.0.0",
+        "gh-pages": "^2.0.1",
+        "husky": "^1.3.1",
+        "jest": "^24.0.0",
+        "lint-staged": "^8.1.0",
+        "rimraf": "^2.6.3",
+        "vuepress": "^1.0.0-alpha.32"
+    },
+    "keywords": [
+        "vue",
+        "code",
+        "demo",
+        "vuepress",
+        "demo-code",
+        "documentation"
+    ],
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/BuptStEve/vuepress-plugin-demo-code.git"
+    },
+    "homepage": "https://buptsteve.github.io/vuepress-plugin-demo-code/",
+    "author": "StEve Young",
+    "license": "MIT"
+}