├── .editorconfig ├── .gitattributes ├── .gitignore ├── .release-it.json ├── CHANGELOG.md ├── LICENSE ├── README.md ├── example ├── .vuepress │ ├── config.js │ └── public │ │ ├── hero.png │ │ └── manifest.json ├── README.md └── using-vue.md ├── index.js ├── package.json ├── site.pdf ├── test └── index.test.js └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.md] 12 | trim_trailing_whitespace = false -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | * text=auto 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | -------------------------------------------------------------------------------- /.release-it.json: -------------------------------------------------------------------------------- 1 | { 2 | "src": { 3 | "tagName": "v%s", 4 | "commitMessage": "%s" 5 | }, 6 | "increment": "conventional:angular", 7 | "beforeChangelogCommand": "conventional-changelog -p angular -i CHANGELOG.md -s", 8 | "changelogCommand": "conventional-changelog -p angular | tail -n +3", 9 | "safeBump": false 10 | } 11 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | 2 | # [0.2.0](https://github.com/ulivz/vuepress-plugin-export/compare/v0.1.0...v0.2.0) (2019-03-10) 3 | 4 | 5 | ### Features 6 | 7 | * upgrade to latest vuepress due to the internal change of node api ([7f74a26](https://github.com/ulivz/vuepress-plugin-export/commit/7f74a26)) 8 | 9 | 10 | 11 | 12 | # 0.1.0 (2019-01-27) 13 | 14 | 15 | ### Features 16 | 17 | * Be born. 18 | * Disable internal webpack log plugin ([858ea4b](https://github.com/ulivz/vuepress-plugin-export/commit/858ea4b)) 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) ULVIZ (https://github.com/ulivz) 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vuepress-plugin-export 2 | 3 | [![NPM version](https://badgen.net/npm/v/vuepress-plugin-export)](https://npmjs.com/package/vuepress-plugin-export) [![NPM downloads](https://badgen.net/npm/dm/vuepress-plugin-export)](https://npmjs.com/package/vuepress-plugin-export) 4 | 5 | > This plugin requires VuePress >= **1.0.0-alpha.44**. 6 | 7 | ## Features 8 | 9 | - Merge all of your pages automatically. 10 | 11 | ## TODO 12 | 13 | - Support default and confurable front cover. 14 | - Inject Table of Contents. 15 | - Inject Page Numbers. 16 | - Generate different PDF files per locale. 17 | - Transform all of links. 18 | 19 | ## Install 20 | 21 | ```bash 22 | npm i vuepress-plugin-export 23 | ``` 24 | 25 | ## Usage 26 | 27 | Using this plugin: 28 | 29 | ```javascript 30 | // .vuepress/config.js 31 | module.exports = { 32 | plugins: ['vuepress-plugin-export'] 33 | } 34 | ``` 35 | 36 | Then run: 37 | 38 | ```bash 39 | vuepress export [path/to/your/docs] 40 | ``` 41 | 42 | ## Generating multiple output files 43 | 44 | You can configure this plugin to export multiple files. 45 | Add config options: 46 | 47 | ```javascript 48 | module.exports: ['vuepress-plugin-export', { 49 | theme: '@vuepress/default', 50 | puppeteer: { args: ['--no-sandbox'] }, 51 | bundles: [{ 52 | filter: (location) => !location.includes('export'), 53 | dest: () => 'docs/public/export.pdf', 54 | }, { 55 | filter: /\/en\///, 56 | dest: (siteConfig) => `docs/public/${siteConfig.title}.en.pdf`, 57 | }] 58 | }] 59 | ``` 60 | 61 | Then run: 62 | 63 | ```bash 64 | vuepress export [path/to/your/docs] 65 | ``` 66 | 67 | ### Config options 68 | - theme: String 69 | - puppeteer: Object 70 | - bundles: Array | Function(Array[PageConfig]) => Array[bundle] 71 | - bundles[].filter: RegExp | Function(location: string, page: PageConfig) => boolean 72 | - bundles[].dest: (config: VuepressPluginConfig(https://vuepress.vuejs.org/config/#basic-config)) => string 73 | - bundles[].sorter: Function(PageConfig, PageConfig) => -1, 0, 1 74 | 75 | with PageConfig: 76 | ``` 77 | url: string 78 | location: string 79 | title: string 80 | path: string 81 | ``` 82 | 83 | ## Development 84 | 85 | ```bash 86 | git clone https://github.com/ulivz/vuepress-plugin-export 87 | cd vuepress-plugin-export 88 | yarn 89 | yarn export 90 | ``` 91 | 92 | > Note that this package is powered by [puppeteer](https://github.com/GoogleChrome/puppeteer), if you are in a mysterious wall, consider setting [environment variables](https://github.com/GoogleChrome/puppeteer/blob/v1.11.0/docs/api.md#environment-variables) before installation. 93 | 94 | ```bash 95 | PUPPETEER_DOWNLOAD_HOST=https://npm.taobao.org/mirrors 96 | ``` 97 | 98 | > Note that this pavkage is powered by [easy-pdf-merge](https://github.com/karuppiah7890/easy-pdf-merge), Java 6 or higher must be present. 99 | 100 | ## Contributing 101 | 102 | 1. Fork it! 103 | 2. Create your feature branch: `git checkout -b my-new-feature` 104 | 3. Commit your changes: `git commit -am 'Add some feature'` 105 | 4. Push to the branch: `git push origin my-new-feature` 106 | 5. Submit a pull request :D 107 | 108 | 109 | ## Author 110 | 111 | **vuepress-plugin-export** © [ULVIZ](https://github.com/ulivz), Released under the [MIT](./LICENSE) License.
112 | Authored and maintained by ULVIZ with help from contributors ([list](https://github.com/ulivz/vuepress-plugin-export/contributors)). 113 | 114 | > [github.com/ulivz](https://github.com/ulivz) · GitHub [@ULVIZ](https://github.com/ulivz) · Twitter [@_ulivz](https://twitter.com/_ulivz) 115 | -------------------------------------------------------------------------------- /example/.vuepress/config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: [ 3 | require('../../') 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /example/.vuepress/public/hero.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ulivz/vuepress-plugin-export/01418c8167f44b4eda638143010cda7a013a8fde/example/.vuepress/public/hero.png -------------------------------------------------------------------------------- /example/.vuepress/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "VuePress", 3 | "short_name": "VuePress", 4 | "icons": [ 5 | { 6 | "src": "/icons/android-chrome-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/icons/android-chrome-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "start_url": "/index.html", 17 | "display": "standalone", 18 | "background_color": "#fff", 19 | "theme_color": "#3eaf7c" 20 | } 21 | -------------------------------------------------------------------------------- /example/README.md: -------------------------------------------------------------------------------- 1 | --- 2 | home: true 3 | heroImage: /hero.png 4 | actionText: Get Started → 5 | actionLink: /guide/ 6 | footer: MIT Licensed | Copyright © 2018-present ULIVZ 7 | --- 8 | 9 |
10 | 11 |
12 | 13 |
14 |
15 |

Simplicity First

16 |

Minimal setup with markdown-centered project structure helps you focus on writing.

17 |
18 |
19 |

Vue-Powered

20 |

Enjoy the dev experience of Vue + webpack, use Vue components in markdown, and develop custom themes with Vue.

21 |
22 |
23 |

Performant

24 |

VuePress generates pre-rendered static HTML for each page, and runs as an SPA once a page is loaded.

25 |
26 |
27 | 28 | ### As Easy as 1, 2, 3 29 | 30 | ``` bash 31 | # install 32 | yarn global add vuepress@next 33 | # OR npm install -g vuepress@next 34 | 35 | # create a markdown file 36 | echo '# Hello VuePress' > README.md 37 | 38 | # start writing 39 | vuepress dev 40 | 41 | # build to static files 42 | vuepress build 43 | ``` 44 | 45 | ::: warning COMPATIBILITY NOTE 46 | VuePress requires Node.js >= 8. 47 | ::: 48 | -------------------------------------------------------------------------------- /example/using-vue.md: -------------------------------------------------------------------------------- 1 | # Using Vue in Markdown 2 | 3 | ## Browser API Access Restrictions 4 | 5 | Because VuePress applications are server-rendered in Node.js when generating static builds, any Vue usage must conform to the [universal code requirements](https://ssr.vuejs.org/en/universal.html). In short, make sure to only access Browser / DOM APIs in `beforeMount` or `mounted` hooks. 6 | 7 | If you are using or demoing components that are not SSR friendly (for example containing custom directives), you can wrap them inside the built-in `` component: 8 | 9 | ``` md 10 | 11 | 12 | 13 | ``` 14 | 15 | Note this does not fix components or libraries that access Browser APIs **on import** - in order to use code that assumes a browser environment on import, you need to dynamically import them in proper lifecycle hooks: 16 | 17 | ``` vue 18 | 27 | ``` 28 | 29 | ## Templating 30 | 31 | ### Interpolation 32 | 33 | Each markdown file is first compiled into HTML and then passed on as a Vue component to `vue-loader`. This means you can use Vue-style interpolation in text: 34 | 35 | **Input** 36 | 37 | ``` md 38 | {{ 1 + 1 }} 39 | ``` 40 | 41 | **Output** 42 | 43 |
{{ 1 + 1 }}
44 | 45 | ### Directives 46 | 47 | Directives also work: 48 | 49 | **Input** 50 | 51 | ``` md 52 | {{ i }} 53 | ``` 54 | 55 | **Output** 56 | 57 |
{{ i }} 
58 | 59 | ### Access to Site & Page Data 60 | 61 | The compiled component does not have any private data but does have access to the [site metadata](../theme/writing-a-theme.md#site-and-page-metadata). For example: 62 | 63 | **Input** 64 | 65 | ``` md 66 | {{ $page }} 67 | ``` 68 | 69 | **Output** 70 | 71 | ``` json 72 | { 73 | "path": "/using-vue.html", 74 | "title": "Using Vue in Markdown", 75 | "frontmatter": {} 76 | } 77 | ``` 78 | 79 | ## Escaping 80 | 81 | By default, fenced code blocks are automatically wrapped with `v-pre`. If you want to display raw mustaches or Vue-specific syntax inside inline code snippets or plain text, you need to wrap a paragraph with the `v-pre` custom container: 82 | 83 | **Input** 84 | 85 | ``` md 86 | ::: v-pre 87 | `{{ This will be displayed as-is }}` 88 | ::: 89 | ``` 90 | 91 | **Output** 92 | 93 | ::: v-pre 94 | `{{ This will be displayed as-is }}` 95 | ::: 96 | 97 | ## Using Components 98 | 99 | Any `*.vue` files found in `.vuepress/components` are automatically registered as [global](https://vuejs.org/v2/guide/components-registration.html#Global-Registration), [async](https://vuejs.org/v2/guide/components-dynamic-async.html#Async-Components) components. For example: 100 | 101 | ``` 102 | . 103 | └─ .vuepress 104 |   └─ components 105 | ├─ demo-1.vue 106 |     ├─ OtherComponent.vue 107 |      └─ Foo 108 |         └─ Bar.vue 109 | ``` 110 | 111 | Inside any markdown file you can then directly use the components (names are inferred from filenames): 112 | 113 | ``` md 114 | 115 | 116 | 117 | ``` 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | ::: warning IMPORTANT 126 | Make sure a custom component's name either contains a hyphen or is in PascalCase. Otherwise it will be treated as an inline element and wrapped inside a `

` tag, which will lead to hydration mismatch because `

` does not allow block elements to be placed inside it. 127 | ::: 128 | 129 | ### Using Components In Headers 130 | 131 | You can use Vue components in the headers, but note the difference between the following two ways: 132 | 133 | | markdown | Output HTML | Parsed Header | 134 | |--------|-------------|----------------| 135 | |

 # text <Tag/> 
| `

text

` | `text` | 136 | |
 # text \`<Tag/>\` 
| `

text <Tag/>

` | `text ` | 137 | 138 | The HTML wrapped by `` will be displayed as is, only the HTML that is not wrapped will be parsed by Vue. 139 | 140 | ::: tip 141 | 142 | The output HTML is accomplished by [markdown-it](https://github.com/markdown-it/markdown-it), while the parsed headers are done by VuePress, and used for the [sidebar](../theme/default-theme-config.md#sidebar) and the document title. 143 | ::: 144 | 145 | ## Using Pre-processors 146 | 147 | VuePress has built-in webpack config for the following pre-processors: `sass`, `scss`, `less`, `stylus` and `pug`. All you need to do is installing the corresponding dependencies. For example, to enable `sass`, install the following in your project: 148 | 149 | ``` bash 150 | yarn add -D sass-loader node-sass 151 | ``` 152 | 153 | Now you can use the following in markdown and theme components: 154 | 155 | ``` vue 156 | 160 | ``` 161 | 162 | Using `