├── .github └── workflows │ └── npm-publish.yml ├── .gitignore ├── .nojekyll ├── .npmignore ├── README.md ├── _sidebar.md ├── cspell.json ├── docs ├── README.md ├── _sidebar.md └── index.html ├── index.html ├── package-lock.json ├── package.json ├── postcss.config.js ├── project-words.txt ├── src ├── code-line-block.ts ├── container-block.ts ├── copy-code.ts ├── index.css ├── line-parser.ts ├── main.ts ├── types.d.ts └── vite-env.d.ts ├── tailwind.config.js ├── tsconfig.json └── vite.config.js /.github/workflows/npm-publish.yml: -------------------------------------------------------------------------------- 1 | # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created 2 | # For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages 3 | 4 | name: Node.js Package 5 | 6 | on: 7 | release: 8 | types: [created] 9 | 10 | jobs: 11 | test: 12 | runs-on: ubuntu-latest 13 | steps: 14 | - uses: actions/checkout@v3 15 | - uses: actions/setup-node@v3 16 | with: 17 | node-version: 16 18 | - run: npm ci 19 | - run: npm run cspell 20 | - run: npm run prettier 21 | 22 | build: 23 | runs-on: ubuntu-latest 24 | steps: 25 | - uses: actions/checkout@v3 26 | - uses: actions/setup-node@v3 27 | with: 28 | node-version: 16 29 | - run: npm ci 30 | - run: npm run build 31 | 32 | publish-npm: 33 | needs: build 34 | runs-on: ubuntu-latest 35 | steps: 36 | - uses: actions/checkout@v3 37 | - uses: actions/setup-node@v3 38 | with: 39 | node-version: 16 40 | registry-url: https://registry.npmjs.org/ 41 | - run: npm ci 42 | - run: npm publish 43 | env: 44 | NODE_AUTH_TOKEN: ${{secrets.npm_token}} 45 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /.nojekyll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dolanmiu/docsify-terminal-block/97c1e326966888728a61d5136ad64c41230932e4/.nojekyll -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | 6 | # Runtime data 7 | pids 8 | *.pid 9 | *.seed 10 | 11 | # Directory for instrumented libs generated by jscoverage/JSCover 12 | lib-cov 13 | 14 | # Coverage directory used by tools like istanbul 15 | coverage 16 | 17 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 18 | .grunt 19 | 20 | # node-waf configuration 21 | .lock-wscript 22 | 23 | # Compiled binary addons (http://nodejs.org/api/addons.html) 24 | build/Release 25 | 26 | # Dependency directory 27 | node_modules 28 | 29 | # Optional npm cache directory 30 | .npm 31 | 32 | # Optional REPL history 33 | .node_repl_history 34 | 35 | # build 36 | # build <-- we want this in the package 37 | build-tests 38 | 39 | # vscode 40 | .vscode 41 | 42 | # docs 43 | docs 44 | 45 | # src 46 | src 47 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # docsify-terminal-block 🖥️ 2 | 3 | [![](https://data.jsdelivr.com/v1/package/npm/docsify-terminal-block/badge)](https://www.jsdelivr.com/package/npm/docsify-terminal-block) 4 | 5 | A docsify plugin to add pretty terminal blocks to your docs. It has `Copy to Clipboard` functionality too. 6 | 7 | ## Screenshots 8 | 9 | ![Example](https://i.imgur.com/IZdOtLh.png) 10 | 11 | ## Installation 12 | 13 | Add the docsify-terminal-block plugin to your index.html after docsify. The plugin is available on jsdelivr (below), unpkg, and other CDN services that auto-publish npm packages. 14 | 15 | ```html 16 | 17 | ``` 18 | 19 | ## Usage 20 | 21 | Add the `terminal` tag to your markdown file to create a terminal block. 22 | 23 | ```` 24 | 25 | ```terminal 26 | npm run start 27 | ``` 28 | ```` 29 | 30 | You can add prefixes to the terminal block to change the style of the line. For example adding `$` or `>`: 31 | 32 | ```` 33 | 34 | ```terminal 35 | $|npm run start 36 | >|npm run start 37 | ``` 38 | ```` 39 | 40 | You can make the line a warning, info, error, or success by adding `warning`, `info`, `error`, or `success` after the prefix: 41 | 42 | ```` 43 | 44 | ```terminal 45 | $|warning|npm run build 46 | >|info|npm run start 47 | >|error|npm run start 48 | >|success|npm run start 49 | ``` 50 | ```` 51 | 52 | ## Example 53 | 54 | ```` 55 | 56 | ```terminal 57 | npm run start 58 | $|npm run start 59 | $|warning|npm run build 60 | >|info|npm run start 61 | |... 62 | >|error|npm run start 63 | >|success|npm run start 64 | 65 | warning|npm run build 66 | ``` 67 | ```` 68 | 69 | --- 70 | 71 | Made with ❤️ 72 | -------------------------------------------------------------------------------- /_sidebar.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | - Getting started 4 | 5 | - [Example](docs/example.md) 6 | -------------------------------------------------------------------------------- /cspell.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json", 3 | "version": "0.2", 4 | "dictionaryDefinitions": [ 5 | { 6 | "name": "project-words", 7 | "path": "./project-words.txt", 8 | "addWords": true 9 | } 10 | ], 11 | "dictionaries": ["project-words"], 12 | "ignorePaths": ["node_modules", "/project-words.txt", "dist"], 13 | "language": "en", 14 | "languageSettings": [ 15 | { 16 | "languageId": "typescript", 17 | "dictionaries": ["typescript", "project-words"] 18 | }, 19 | { 20 | "languageId": "javascript", 21 | "dictionaries": ["javascript", "project-words"] 22 | } 23 | ] 24 | } 25 | -------------------------------------------------------------------------------- /docs/README.md: -------------------------------------------------------------------------------- 1 | ## Example page 2 | 3 | 4 | 5 | ```terminal 6 | npm run start 7 | $|npm run start 8 | $|warning|npm run build 9 | >|info|npm run start 10 | |... 11 | >|error|npm run start 12 | >|success|npm run start 13 | 14 | warning|npm run build 15 | ``` 16 | 17 | ```bash 18 | $ npm run start 19 | $ npm run build 20 | ``` 21 | 22 | Lorem ipsum dolor sit amet, _consectetur_ adipisicing elit, sed do eiusmod 23 | tempor incididunt ut **labore et dolore magna aliqua**. Ut enim ad minim veniam, 24 | quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 25 | consequat. **_Duis aute irure dolor_** in reprehenderit in voluptate velit esse 26 | cillum dolore eu fugiat nulla pariatur. ~~Excepteur sint occaecat~~ cupidatat non 27 | proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 28 | 29 | ## H2 30 | 31 | Lorem ipsum dolor sit amet, _consectetur_ adipisicing elit, sed do eiusmod 32 | tempor incididunt ut **labore et dolore magna aliqua**. Ut enim ad minim veniam, 33 | quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 34 | consequat. 35 | 36 | --- 37 | 38 | **_Duis aute irure dolor_** in reprehenderit in voluptate velit esse 39 | cillum dolore eu fugiat nulla pariatur. ~~Excepteur sint occaecat~~ cupidatat non 40 | proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 41 | 42 | 43 | 44 | ### H3 45 | 46 | unordered list: 47 | 48 | - item-1 49 | - sub-item-1 50 | - sub-item-2 51 | 52 | * item-2 53 | - sub-item-3 54 | - sub-item-4 55 | 56 | - item-3 57 | - sub-item-5 58 | - sub-item-6 59 | 60 | ordered list: 61 | 62 | 1. item-1 63 | 1. sub-item-1 64 | 2. sub-item-2 65 | 2. item-2 66 | 1. sub-item-3 67 | 2. sub-item-4 68 | 3. item-3 69 | 70 | #### Header4 71 | 72 | | Table Header-1 | Table Header-2 | Table Header-3 | 73 | | :------------- | :------------: | -------------: | 74 | | Table Data-1 | Table Data-2 | Table Data-3 | 75 | | TD-4 | Td-5 | TD-6 | 76 | | Table Data-7 | Table Data-8 | Table Data-9 | 77 | 78 | ##### Header5 79 | 80 | You may also want some images right in here like ![GitHub Logo](https://cloud.githubusercontent.com/assets/5456665/13322882/e74f6626-dc00-11e5-921d-f6d024a01eaa.png "GitHub") - you can do that but I would recommend you to use the component "image" and simply split your text. 81 | -------------------------------------------------------------------------------- /docs/_sidebar.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | - Getting started 4 | 5 | - [Example](docs/example.md) 6 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Docsify Terminal Block 6 | 7 | 8 | 12 | 16 | 22 | 23 | 24 |
25 | 26 | 34 | 35 | 36 | 37 | 41 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Docsify Terminal Block 6 | 7 | 8 | 12 | 16 | 17 | 18 | 19 |
20 | 27 | 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "docsify-terminal-block", 3 | "version": "1.0.3", 4 | "description": "", 5 | "files": [ 6 | "dist" 7 | ], 8 | "main": "dist/index.iife.js", 9 | "scripts": { 10 | "dev": "concurrently \"npm run build:watch\" \"npm run serve:dist\" \"npm run serve:docs\"", 11 | "serve:docs": "docsify serve docs", 12 | "serve:dist": "http-server dist", 13 | "build": "tsc && vite build", 14 | "build:watch": "vite build --watch", 15 | "prepublishOnly": "npm run build", 16 | "preview": "vite preview", 17 | "cspell": "cspell \"**\"", 18 | "prettier": "prettier -l .", 19 | "prettier:fix": "npm run prettier -- --write", 20 | "test": "echo \"Error: no test specified\" && exit 1" 21 | }, 22 | "author": "", 23 | "license": "ISC", 24 | "repository": { 25 | "type": "git", 26 | "url": "git+https://github.com/dolanmiu/docsify-terminal-block.git" 27 | }, 28 | "homepage": "https://github.com/dolanmiu/docsify-terminal-block", 29 | "devDependencies": { 30 | "autoprefixer": "^10.4.14", 31 | "concurrently": "^8.0.1", 32 | "cspell": "^6.30.0", 33 | "docsify-cli": "^4.4.4", 34 | "http-server": "^14.1.1", 35 | "postcss": "^8.4.21", 36 | "prettier": "^2.8.4", 37 | "tailwindcss": "^3.2.7", 38 | "typescript": "^5.0.2", 39 | "vite": "^4.2.0", 40 | "vite-plugin-css-injected-by-js": "^3.1.0" 41 | }, 42 | "dependencies": { 43 | "daisyui": "^2.51.4" 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | }; 7 | -------------------------------------------------------------------------------- /project-words.txt: -------------------------------------------------------------------------------- 1 | chrono 2 | daisyui 3 | docsify 4 | iife 5 | jsdelivr 6 | tailwindcss 7 | -------------------------------------------------------------------------------- /src/code-line-block.ts: -------------------------------------------------------------------------------- 1 | import { LinePayload } from "./line-parser"; 2 | 3 | export const createLineBlocks = ( 4 | lines: readonly LinePayload[] 5 | ): readonly HTMLElement[] => { 6 | //
$|npm run start $|npm run build
7 | const lineBlocks = lines.map((line) => { 8 | const lineBlock = document.createElement("pre"); 9 | lineBlock.setAttribute("v-pre", ""); 10 | lineBlock.setAttribute("data-lang", ""); 11 | if (line.prefix) { 12 | lineBlock.setAttribute("data-prefix", line.prefix); 13 | } 14 | lineBlock.setAttribute( 15 | "style", 16 | "background-color: transparent; padding: 0; margin: 0; display: flex;" 17 | ); 18 | 19 | const codeBlock = document.createElement("code"); 20 | codeBlock.setAttribute("class", "lang-terminal"); // Or lang-bash 21 | codeBlock.classList.add("lang-terminal"); 22 | codeBlock.setAttribute( 23 | "style", 24 | "background-color: transparent !important; padding: 0; margin: 0;" 25 | ); 26 | 27 | switch (line.type) { 28 | case "info": 29 | lineBlock.classList.add("!dtb-bg-info", "!dtb-text-info-content"); 30 | codeBlock.classList.add("!dtb-text-warning-content", "dtb-opacity-80"); 31 | break; 32 | case "error": 33 | lineBlock.classList.add("!dtb-bg-error", "!dtb-text-error-content"); 34 | codeBlock.classList.add("!dtb-text-error-content", "dtb-opacity-80"); 35 | break; 36 | case "success": 37 | lineBlock.classList.add("!dtb-bg-success", "!dtb-text-success-content"); 38 | codeBlock.classList.add("!dtb-text-success-content", "dtb-opacity-80"); 39 | break; 40 | case "warning": 41 | lineBlock.classList.add("!dtb-bg-warning", "!dtb-text-warning-content"); 42 | codeBlock.classList.add("!dtb-text-warning-content", "dtb-opacity-80"); 43 | break; 44 | default: 45 | codeBlock.classList.add("!dtb-text-white"); 46 | break; 47 | } 48 | 49 | codeBlock.textContent = line.text; 50 | lineBlock.appendChild(codeBlock); 51 | return lineBlock; 52 | }); 53 | 54 | return lineBlocks; 55 | }; 56 | -------------------------------------------------------------------------------- /src/container-block.ts: -------------------------------------------------------------------------------- 1 | export const createContainerBlock = (elements: HTMLElement[]) => { 2 | //
...
3 | 4 | const output = document.createElement("div"); 5 | output.classList.add("dtb-mockup-code"); 6 | elements.forEach((element) => { 7 | output.appendChild(element); 8 | 9 | const copyToClipboardOriginal = element.querySelectorAll( 10 | ".docsify-copy-code-button" 11 | ); 12 | copyToClipboardOriginal.forEach((e) => e.remove()); 13 | }); 14 | 15 | //
16 | const tooltip = document.createElement("div"); 17 | tooltip.classList.add( 18 | "dtb-tooltip", 19 | "dtb-tooltip-left", 20 | "dtb-tooltip-accent", 21 | "dtb-absolute", 22 | "dtb-top-2", 23 | "dtb-right-2" 24 | ); 25 | tooltip.setAttribute("data-tip", "Copy"); 26 | output.appendChild(tooltip); 27 | 28 | // 29 | const copyButton = document.createElement("button"); 30 | copyButton.classList.add( 31 | "dtb-btn", 32 | "dtb-btn-square", 33 | "dtb-btn-sm", 34 | "dtb-border-0", 35 | "dtb-relative", 36 | "dtb-opacity-100", 37 | "docsify-terminal-copy-button" 38 | ); 39 | const copyButtonIcon = document.createElement("svg"); 40 | copyButtonIcon.classList.add("dtb-w-5", "dtb-h-5", "dtb-fill-current"); 41 | copyButtonIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); 42 | copyButtonIcon.setAttribute("viewBox", "0 0 32 32"); 43 | const copyButtonIconPath = document.createElement("path"); 44 | copyButtonIconPath.setAttribute( 45 | "d", 46 | "M 16 3 C 14.742188 3 13.847656 3.890625 13.40625 5 L 6 5 L 6 28 L 26 28 L 26 5 L 18.59375 5 C 18.152344 3.890625 17.257813 3 16 3 Z M 16 5 C 16.554688 5 17 5.445313 17 6 L 17 7 L 20 7 L 20 9 L 12 9 L 12 7 L 15 7 L 15 6 C 15 5.445313 15.445313 5 16 5 Z M 8 7 L 10 7 L 10 11 L 22 11 L 22 7 L 24 7 L 24 26 L 8 26 Z" 47 | ); 48 | copyButtonIcon.appendChild(copyButtonIconPath); 49 | copyButton.appendChild(copyButtonIcon); 50 | 51 | tooltip.appendChild(copyButton); 52 | 53 | return output; 54 | }; 55 | -------------------------------------------------------------------------------- /src/copy-code.ts: -------------------------------------------------------------------------------- 1 | export const addCopyCodeFunctionality = () => { 2 | const buttons = document.querySelectorAll(".docsify-terminal-copy-button"); 3 | buttons.forEach((button) => { 4 | button.addEventListener("click", (element) => { 5 | const toolTip = (element.target as HTMLElement).parentElement 6 | ?.parentElement; 7 | const elements = Array.from( 8 | toolTip?.parentElement?.querySelectorAll("pre") ?? [] 9 | ); 10 | 11 | const code = elements 12 | .map((e) => e.innerText) 13 | .filter((e) => e) 14 | .join("\r"); 15 | 16 | toolTip?.setAttribute("data-tip", "Copied!"); 17 | toolTip?.classList.add("dtb-tooltip-open"); 18 | setTimeout(() => { 19 | toolTip?.setAttribute("data-tip", "Copy"); 20 | }, 2000); 21 | setTimeout(() => { 22 | toolTip?.classList.remove("dtb-tooltip-open"); 23 | }, 1800); 24 | 25 | navigator.clipboard.writeText(code); 26 | }); 27 | }); 28 | }; 29 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | -------------------------------------------------------------------------------- /src/line-parser.ts: -------------------------------------------------------------------------------- 1 | type LineType = "info" | "error" | "success" | "warning" | "default"; 2 | export type LinePayload = { 3 | prefix?: string; 4 | type: LineType; 5 | text: string; 6 | }; 7 | 8 | const LINE_TYPE_SET = new Set([ 9 | "info", 10 | "error", 11 | "success", 12 | "warning", 13 | "default", 14 | ]); 15 | 16 | export const parseLine = (line: string): LinePayload => { 17 | // String comes in this format 18 | // $|npm run start 19 | // or 20 | // $|warning|npm run build 21 | // where $ is the prefix and warning is the type 22 | let [prefix, type, text] = line.split("|") as (string | undefined)[]; 23 | 24 | if (text === undefined) { 25 | text = type; 26 | } 27 | 28 | if (type === undefined) { 29 | type = "default"; 30 | text = prefix; 31 | prefix = undefined; 32 | } 33 | 34 | type = LINE_TYPE_SET.has(type as LineType) ? type : "default"; 35 | if (LINE_TYPE_SET.has(prefix as LineType)) { 36 | type = prefix; 37 | prefix = undefined; 38 | } 39 | 40 | return { 41 | prefix, 42 | type: (type as LineType) || "default", 43 | text: text ?? "", 44 | }; 45 | }; 46 | -------------------------------------------------------------------------------- /src/main.ts: -------------------------------------------------------------------------------- 1 | import "./index.css"; 2 | 3 | import { createContainerBlock } from "./container-block"; 4 | import { createLineBlocks } from "./code-line-block"; 5 | import { parseLine } from "./line-parser"; 6 | import { addCopyCodeFunctionality } from "./copy-code"; 7 | 8 | declare var $docsify: any; 9 | 10 | (function () { 11 | const myPlugin = (hook: any, _vm: any) => { 12 | hook.doneEach(function () { 13 | const originalBlocks = document.querySelectorAll( 14 | `pre[data-lang="terminal"]` 15 | ); 16 | 17 | originalBlocks.forEach((node) => { 18 | node.setAttribute("data-lang", ""); 19 | node.setAttribute("data-prefix", ">"); 20 | const codeNode = node.getElementsByTagName("code")[0]; 21 | const lines = codeNode.textContent?.split("\n") || []; 22 | 23 | node.setAttribute( 24 | "style", 25 | "background-color: transparent; padding: 0; margin: 0; display: flex;" 26 | ); 27 | codeNode.setAttribute( 28 | "style", 29 | "background-color: transparent !important; padding: 0; margin: 0; color: white;" 30 | ); 31 | node.removeAttribute(":after"); 32 | 33 | node.outerHTML = createContainerBlock([ 34 | ...createLineBlocks(lines.map((line) => parseLine(line))), 35 | ]).outerHTML; 36 | 37 | addCopyCodeFunctionality(); 38 | }); 39 | }); 40 | }; 41 | // Add plugin to docsify's plugin array 42 | (window as any).$docsify = (window as any).$docsify || {}; 43 | (window as any).$docsify.plugins = [].concat( 44 | (window as any).$docsify.plugins || [], 45 | myPlugin as any 46 | ); 47 | })(); 48 | -------------------------------------------------------------------------------- /src/types.d.ts: -------------------------------------------------------------------------------- 1 | declare global { 2 | interface Window { 3 | $docsify: any; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /tailwind.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('tailwindcss').Config} */ 2 | module.exports = { 3 | prefix: "dtb-", 4 | corePlugins: { 5 | preflight: false, 6 | }, 7 | content: ["./src/**/*.{js,ts,jsx,tsx}"], 8 | theme: { 9 | extend: {}, 10 | }, 11 | plugins: [require("daisyui")], 12 | daisyui: { 13 | themes: false, 14 | }, 15 | }; 16 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ESNext", 4 | "useDefineForClassFields": true, 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "moduleResolution": "Node", 8 | "strict": true, 9 | "resolveJsonModule": true, 10 | "isolatedModules": true, 11 | "esModuleInterop": true, 12 | "noEmit": true, 13 | "noUnusedLocals": true, 14 | "noUnusedParameters": true, 15 | "noImplicitReturns": true, 16 | "jsx": "react-jsx", 17 | "skipLibCheck": true 18 | }, 19 | "include": ["src"] 20 | } 21 | -------------------------------------------------------------------------------- /vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from "vite"; 2 | import { resolve } from "path"; 3 | import cssInjectedByJsPlugin from "vite-plugin-css-injected-by-js"; 4 | 5 | export default defineConfig({ 6 | plugins: [ 7 | cssInjectedByJsPlugin({ 8 | injectCodeFunction: (cssCode, options) => { 9 | try { 10 | if (typeof document != "undefined") { 11 | var elementStyle = document.createElement("style"); 12 | const cssWithoutDataTheme = cssCode.replace( 13 | /\[data-theme\]{[^{}]*}/g, 14 | "" 15 | ); 16 | elementStyle.appendChild( 17 | document.createTextNode(cssWithoutDataTheme) 18 | ); 19 | document.head.appendChild(elementStyle); 20 | } 21 | } catch (e) { 22 | console.error("vite-plugin-css-injected-by-js", e); 23 | } 24 | }, 25 | }), 26 | ], 27 | build: { 28 | lib: { 29 | entry: [resolve(__dirname, "src/main.ts")], 30 | name: "docsifyTerminalBlock", 31 | fileName: "index", 32 | formats: ["iife"], 33 | }, 34 | outDir: resolve(__dirname, "dist"), 35 | commonjsOptions: { 36 | include: [/node_modules/], 37 | }, 38 | }, 39 | }); 40 | --------------------------------------------------------------------------------