Public API

helpers (default export from client/helpers/index.js)

const helpers: {
  filesize(rawSize: number): string
  makeSafePath(rawPath: string): string
  resolvePath(path: string): string
  setInputSelection(input: HTMLInputElement, startPos: number, endPos: number): void
}

export default {
  install(Vue: VueConstructor): void
}

A Vue plugin that installs $helpers onto every component instance. filesize converts a byte count to a human-readable uppercase string. makeSafePath normalizes arbitrary user-typed paths into URL-safe kebab-case segments. Install once via Vue.use(helpers) before mounting the app.

Vuex store (default export from client/store/index.js)

import { Store } from 'vuex'

const store: Store<{
  loadingStack: string[]
  notification: {
    message: string
    style: string
    icon: string
    isActive: boolean
  }
}>

// Key mutations:
store.commit('loadingStart', stackName: string): void
store.commit('loadingStop', stackName: string): void
store.commit('showNotification', opts: { message: string; style?: string; icon?: string }): void
store.commit('pushGraphError', err: ApolloError): void

// Getter:
store.getters.isLoading: boolean

The root Vuex store managing global loading state and notification banners. Use loadingStart/loadingStop with a named stack key to track concurrent async operations without race conditions. Use pushGraphError as a unified handler for Apollo GraphQL errors.

markdown-it-underline plugin (client/libs/markdown-it-underline/index.js)

import MarkdownIt from 'markdown-it'
const underlinePlugin: (md: MarkdownIt) => void
module.exports = underlinePlugin

A markdown-it renderer rule override that converts _text_ (single-underscore emphasis) into <u>text</u> (underline) instead of <em>. Register it via md.use(require('./libs/markdown-it-underline')). Use this when you need Word-like underline semantics in a markdown editor rather than italic.

Working examples

Scenario - Installing the Vue helpers plugin

Register $helpers globally so all Vue components can call this.$helpers.filesize(n) without per-component imports.

import Vue from 'vue'
import helpers from './wiki/client/helpers/index.js'

Vue.use(helpers)

// Inside any component:
const size = Vue.prototype.$helpers.filesize(1048576)
// => "1 MB"

const safe = Vue.prototype.$helpers.makeSafePath('  Hello World / Foo Bar  ')
// => "hello-world/foo-bar"

Scenario - Wiring the Vuex store into an Express + Vue SSR app

import Vue from 'vue'
import store from './wiki/client/store/index.js'

// Start a named loading operation
store.commit('loadingStart', 'fetchDocs')

async function fetchDocs() {
  try {
    const result = await someApolloClient.query({ query: MY_QUERY })
    store.commit('loadingStop', 'fetchDocs')
    return result
  } catch (err) {
    store.commit('pushGraphError', err)
    store.commit('loadingStop', 'fetchDocs')
  }
}

// Check loading state in a computed property
console.log(store.getters.isLoading) // true while fetchDocs is pending

Scenario - Applying the underline markdown-it plugin

import MarkdownIt from 'markdown-it'
const underline = require('./wiki/client/libs/markdown-it-underline/index.js')

const md = new MarkdownIt()
md.use(underline)

const html = md.render('This is _underlined_ and *italic*.')
// => <p>This is <u>underlined</u> and <em>italic</em>.</p>

Scenario - Starting the server in developer mode

// In a custom dev entrypoint that wraps the wiki dev utility
process.env.NODE_ENV = 'development'

const devUtil = require('./wiki/dev/index.js')
devUtil.dev()
// Starts webpack-dev-middleware + hot reload, then boots the server
// Type "rs" + Enter in stdin to trigger a manual restart

File walkthrough

• .devcontainer/ - Defines a Docker-based VS Code development container; not needed in production deployments.
• .github/ - GitHub Actions CI/CD pipelines for Docker image builds, Helm chart releases, and Packer images; issue triage automation.
• .vscode/ - Workspace-specific editor configuration; safe to ignore outside VS Code.
• client/ - All frontend source: Vue SFCs for admin, editor, auth flows; Vuex modules for page, site, user state; SCSS design tokens; GraphQL query documents; webpack entry points.
• dev/ - Developer CLI that wires webpack-dev-middleware and chokidar file watching, then boots the server; also houses Cypress plugin scaffolding.
• server/ - Express application bootstrap, Apollo GraphQL schema and resolvers, authentication strategies, database models, and all backend module loaders.
• .eslintrc.yml - Project-wide ESLint rules; extends StandardJS with Vue plugin.
• config.sample.yml - Canonical reference for all supported configuration keys; copy to config.yml before running.
• cypress.json - Cypress base URL and integration folder configuration for e2e tests.
• package.json - Single root manifest; contains dev, build, start, analyze scripts.

Common pitfalls and fixes

• siteConfig is not defined - client/helpers/index.js reads the global siteConfig; ensure the server injects it into the HTML template or define global.siteConfig in your SSR entry before importing helpers.
• WIKI global missing - The Vuex store's pushGraphError mutation calls WIKI.$store; set global.WIKI = { $store: store } before committing that mutation outside the canonical boot sequence.
• vuex-pathify peer version mismatch - make.mutations from vuex-pathify requires Vuex 3.x (Vue 2); do not upgrade to Vuex 4 without migrating the entire client to Vue 3.
• Webpack alias not resolving ~ imports - Several client files use ~client/ aliases; add the alias to your bundler config or the build will fail with module-not-found errors.
• Database not initialized before server import - require('../server') in dev/index.js expects config.yml at process.cwd(); running from a different working directory causes a silent config load failure.
• ESM/CJS interop in markdown-it-underline - The plugin uses module.exports; when imported from an ESM context use import underline from '...' or createRequire to avoid default wrapping issues.

Vibe-coding prompt template

I have a copy of the Wiki.js source (wiki@2.0.0) located in the `source/`
directory of this repo. I also have USAGE.md which documents its real exports
and integration patterns.

Please help me integrate Wiki.js into my existing Node.js/Express project
step by step:

1. Read USAGE.md fully before writing any code.
2. Wire `source/server/` as the wiki backend mounted at `/wiki` on my Express app.
3. Register the Vue helpers plugin from `source/client/helpers/index.js` in
   my Vue 2 entry point.
4. Connect the Vuex store from `source/client/store/index.js` to my existing
   store using `store.registerModule`.
5. Configure webpack to resolve `source/client/` aliases (`~client`).
6. Set up the required environment variables and `config.yml` from
   `source/config.sample.yml`.
7. Show me how to use `pushGraphError` and `loadingStart`/`loadingStop` in
   my existing Apollo Client error-handling middleware.

Use only the APIs documented in USAGE.md. Do not invent new exports.
Reference the upstream package as `user@example.com` (https://github.com/Requarks/wiki).

License and credit

Wiki.js is licensed under the GNU Affero General Public License v3.0 (AGPLv3). See source/LICENSE for the full license text. Any modifications to Wiki.js source that are run as a network service must be made available under the same license.

Upstream repository: https://github.com/Requarks/wiki npm package: user@example.com

This product’s unique contribution is clean room implementation of valuable code block into AVCP compatible standard.

完全なインストールガイドと統合プロンプトは購入後に解放されます。

BookStack Self-Hosted Documentation and Wiki Platform

PHP, Laravel & Business Scripts

無料