Code Monkey home page Code Monkey logo

vitepress-plugin-simple-search's Introduction

Hey Listen!

This repository is no longer necessary. Vitepress has offline search built in as of alpha 66.




Vitepress Simple Search

Vitepress needs better offline search. Let's make it simple and quick.

Thanks to everyone in this thread for offline search for getting the general idea implemented.

Features

  • Utilizes front-matter for page titles.
  • Auto-strips content of extra tags.
  • Auto-reads all markdown documents, and creates search data based on that.
  • Ability to change baseURL for doc pathing.
  • Ability to change regexp for content stripping and searching content.
  • Ability to use quotes for stricter search results in-search.
  • Option to change docs path.
  • Option to ignore specific files or folders based on partial naming.

Required

Make sure all of your markdown documents have title in their front matter.

Example:

---
title: 'My Cool Document'
---

# {{ $frontmatter.title }}

Content, and everything else...

Installing

npm i vitepress-plugin-simple-search

Add the plugin

Create a file in docs called vite.config.js or vite.config.ts.

// docs/vite.config.js
import { SimpleSearch } from "vitepress-plugin-simple-search";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [SimpleSearch()],
});

Additional Options

These can be passed through the SimpleSearch function.

export interface Options {
    /**
     * Base URL to use for content link replacement.
     *
     * @type {string}
     * @memberof Options
     */
    baseURL?: string;

    /**
     * Pathway to docs folder.
     * Must be an absolute path.
     * Defaults to 'docs' folder.
     *
     * @type {string}
     * @memberof Options
     */
    docsPath?: string;

    /**
     * A list of strings of partial file names or folders to ignore and not add to search.
     *
     * @type {Array<string>}
     * @memberof Options
     */
    partialsToIgnore?: Array<string>;

    /**
     * Used as a regex content remover for non-matching characters.
     * Setting this to undefined turns off all content stripping.
     * May have unintended side effects.
     *
     * @type {RegExp | undefined}
     * @memberof Options
     */
    regexForContentStripping?: RegExp | undefined;
}

Example

SimpleSearch({ baseURL: '/my-repo', regexForContentStripping: undefined });

vitepress-plugin-simple-search's People

Contributors

amritnagi avatar jeffholst avatar pandapip1 avatar stuyk avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

vitepress-plugin-simple-search's Issues

Allow peer dependecy of vite to use v4

Now that vite v4 is around for several months, it's time to update the peer dependency.
My suggestion is to formally drop support for version 2 and only allow version 3 or 4.

Search includes content from node_modules

I've got a vitepress site in the root of my project, as opposed to in the docs/ folder.

It seems that the search is including markdown files from node_modules/ when it builds its index. That is undesirable.

Add option to transform front matter

I have a transformPageData config entry in my vitepress website, and it's used to add a prefix to all the titles of the files in a specific folder. However, this plugin appears to not be detecting those updates. Is it possible to add a config for transforming the front matter?

Search Scale for Mobile

Didn't implement any css to scale the search box correctly for mobile environments. Need to get this resolved.

Incorrect links generated when markdown files are not in a docs/ folder

Relating to #5, I've got a repo with the docs in the project root instead of a docs/ subfolder.

The link being generated for files is assuming docs is in the path. When generating file info, replaces the path up up to docs/ to make the link, which results in incorrect links if docs isn't in the path.

For example, in my repo, employee-handbook/index.md has a link with the full filesystem path. This results in a 404 when clicking the search result because it'll attempt to navigate to https://my-website.net/home/runner/work/. . ..

image

I can try a PR if you're open to it!

SearchPlugin is not a function

Just trying this out and when I try and run it, I get the following??


> ***********@1.0.0 docs:dev
> vitepress dev docs

vitepress v1.0.0-alpha.17
failed to load config from C:\******\docs\vite.config.js
failed to start server. error:
 TypeError: (0 , import_vitepress_plugin_simple_search.SearchPlugin) is not a function      
    at Object.<anonymous> (C:\******\docs\vite.config.js:28:68)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object._require.extensions.<computed> [as .js] (file:///C:/******/node_modules/vite/dist/node/chunks/dep-6b3a5aff.js:63514:24)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at loadConfigFromBundledFile (file:///C:/******/node_modules/vite/dist/node/chunks/dep-6b3a5aff.js:63522:21)
    at loadConfigFromFile (file:///C:/******/node_modules/vite/dist/node/chunks/dep-6b3a5aff.js:63381:34)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

The config is just copied and pasted from the readme.

import { SearchPlugin } from "vitepress-plugin-simple-search";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [SearchPlugin()],
});

Plugin fails with "[vite] Internal server error: _.existsSync is not a function"

I've installed your plugin with the instructions from the README.md file. However, when I run vitepress dev docs, the following error message is printed to the console:

[vite] Internal server error: _.existsSync is not a function at Context.load (/Users/patrickineichen/Git/arc42-vitepress/node_modules/vitepress-plugin-simple-search/dist/simple-search.umd.js:1:2042) at Object.load (file:///Users/patrickineichen/Git/arc42-vitepress/node_modules/vite/dist/node/chunks/dep-4da11a5e.js:41084:46) at loadAndTransform (file:///Users/patrickineichen/Git/arc42-vitepress/node_modules/vite/dist/node/chunks/dep-4da11a5e.js:37312:46) at doTransform (file:///Users/patrickineichen/Git/arc42-vitepress/node_modules/vite/dist/node/chunks/dep-4da11a5e.js:37298:20) at runMicrotasks (<anonymous>) at processTicksAndRejections (node:internal/process/task_queues:96:5)

My assumption is, that you need to provide fs-extra in the output globals of vite.config.ts and reference fs from fs-extra in src/index.ts.
At least, it worked this way when I tried it out locally.
I can make a pull request if required.

Provide example

I tried out this library, but couldn't quite get it to work.

My repository uses "type": "module" https://github.com/stefnotch/blog/blob/3d8572b060abdcb17ae90f0193766e2d51603214/package.json#L2 and has a minimal vite.config.ts file in the docs folder https://github.com/stefnotch/blog/blob/main/docs/vite.config.ts

When I start mine, I get the following confusing error

> vitepress dev docs

failed to load config from C:\Coding\GitHub\Other\Blog\docs\vite.config.ts
failed to start server. error:
file:///C:/Coding/GitHub/Other/Blog/docs/vite.config.ts.timestamp-1677749039970.mjs:2
import { SimpleSearch } from "file:///C:/Coding/GitHub/Other/Blog/node_modules/vitepress-plugin-simple-search/dist/simple-search.es.js";
         ^^^^^^^^^^^^
SyntaxError: Named export 'SimpleSearch' not found. The requested module 'file:///C:/Coding/GitHub/Other/Blog/node_modules/vitepress-plugin-simple-search/dist/simple-search.es.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'file:///C:/Coding/GitHub/Other/Blog/node_modules/vitepress-plugin-simple-search/dist/simple-search.es.js';
const { SimpleSearch } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)    
    at async ModuleJob.run (node:internal/modules/esm/module_job:190:5) 

OS: Windows 10
node --version: v18.14.0
npm --version: 9.3.1

hi!

Hey guys, I got a question:
I just copied how to use it.
The search window does not appear.
What should I do?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.