Procházet zdrojové kódy

[md]Create rollup-plugin-md-ts

dufu1991 před 1 rokem
rodič
revize
74353a3295

+ 10 - 0
packages/rollup-plugin-md-ts/.prettierrc

@@ -0,0 +1,10 @@
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 140,
+	"plugins": [],
+	"overrides": [
+		
+	]
+}

+ 77 - 0
packages/rollup-plugin-md-ts/README.md

@@ -0,0 +1,77 @@
+[简体中文](https://github.com/any-tdf/stdf/blob/main/packages/rollup-plugin-md-ts/README_CN.md)
+
+## Introduction
+
+This is a Rollup/Vite plugin that converts Markdown files to HTML strings, based on [marked](https://github.com/markedjs/marked).
+
+The implementation idea is based on [rollup-plugin-md](https://github.com/xiaofuzi/rollup-plugin-md), adding TypeScript and compatible with Vite's plugin type.
+
+The STDF new site <https://next.stdf.design> uses this plugin.
+
+## Parameters
+
+| Parameter | Type | Default | Description                                                                           |
+| --------- | ---- | -------- | ------------------------------------------------------------------------------ |
+| marked    | `MarkedOptions` | `{}`   | [marked](https://github.com/markedjs/marked) 的配置。                       |
+| include  | `string[]`      | `['**/*.md']`      | The path of the Markdown file to include.                                                 |
+| exclude  | `string[]`      | `[]`               | The path of the Markdown file to exclude.                                                 |
+
+The `include` and `exclude` parameters are relative to the project root directory (usually the directory where vite.config.js or vite.config.ts is located).
+
+## Installation
+
+<!-- :::code-groups -->
+<!-- pnpm -->
+```sh
+pnpm i rollup-plugin-md-ts -D
+```
+<!-- :: -->
+<!-- npm -->
+```sh
+npm i rollup-plugin-md-ts -D
+```
+<!-- :: -->
+<!-- bun -->
+```sh
+bun add rollup-plugin-md-ts -D
+```
+<!-- :: -->
+<!-- yarn -->
+```sh
+yarn add rollup-plugin-md-ts -D
+```
+<!-- ::: -->
+
+## Usage
+
+Configure in vite.config.js or vite.config.ts:
+
+```javascript
+import md from 'rollup-plugin-md-ts';
+
+export default defineConfig({
+    // ...
+	plugins: [
+		// ...
+		md({
+			marked: {},
+			include: [ './src/**/*.md']
+		})
+		// ...
+	],
+	// ...
+});
+```
+
+## Why Create
+
+There are already many plugins that can implement similar functions, such as [vite-plugin-markdown](https://www.npmjs.com/package/vite-plugin-markdown), which do not convert the following characters when converting to-do lists, which is exactly the function needed in [STDF](https://stdf.design).
+
+```md
+- [ ] TODO
+- [x] DONE
+```
+
+## License
+
+This project is licensed under the [MIT License](https://github.com/any-tdf/stdf/blob/main/LICENSE). Feel free to enjoy and contribute to this open source project.

+ 77 - 0
packages/rollup-plugin-md-ts/README_CN.md

@@ -0,0 +1,77 @@
+[English](https://github.com/any-tdf/stdf/blob/main/packages/rollup-plugin-md-ts/README.md)
+
+## 介绍
+
+一款 Rollup/Vite 插件,功能是将 Markdown 文件转换为 HTML 字符串,基于 [marked](https://github.com/markedjs/marked) 。
+
+实现思路参考 [rollup-plugin-md](https://github.com/xiaofuzi/rollup-plugin-md) ,增加了 TypeScript 并兼容 Vite 的插件类型。
+
+STDF 新站点 <https://next.stdf.design> 使用了此插件。
+
+## 参数
+
+| 参数     | 类型 | 默认             | 描述                                                                           |
+| -------- | ---- | ---------------- | ------------------------------------------------------------------------------ |
+| marked   | `MarkedOptions` | `{}`   | [marked](https://github.com/markedjs/marked) 的配置。                       |
+| include  | `string[]`      | `['**/*.md']`      | 要包含的 Markdown 文件路径。                                                 |
+| exclude  | `string[]`      | `[]`               | 要排除的 Markdown 文件路径。                                                 |
+
+其中 include 和 exclude 是相对与项目根目录(一般就是 vite.config.js 或 vite.config.ts 所在目录)的相对路径。
+
+## 安装
+
+<!-- :::code-groups -->
+<!-- pnpm -->
+```sh
+pnpm i rollup-plugin-md-ts -D
+```
+<!-- :: -->
+<!-- npm -->
+```sh
+npm i rollup-plugin-md-ts -D
+```
+<!-- :: -->
+<!-- bun -->
+```sh
+bun add rollup-plugin-md-ts -D
+```
+<!-- :: -->
+<!-- yarn -->
+```sh
+yarn add rollup-plugin-md-ts -D
+```
+<!-- ::: -->
+
+## 使用
+
+在 vite.config.js 或 vite.config.ts 中配置:
+
+```javascript
+import md from 'rollup-plugin-md-ts';
+
+export default defineConfig({
+    // ...
+	plugins: [
+		// ...
+		md({
+			marked: {},
+			include: [ './src/**/*.md']
+		})
+		// ...
+	],
+	// ...
+});
+```
+
+## 为何创建
+
+其实市面上已经有很多能实现类似功能的插件,比如 [vite-plugin-markdown](https://www.npmjs.com/package/vite-plugin-markdown) ,这些基于 [markdown-it](https://www.npmjs.com/package/markdown-it) 的插件在转换待办事项列表时,并不会转换以下字符,而这个正好是 [STDF](https://stdf.design) 中需要用到的功能。
+
+```md
+- [ ] 待办事项
+- [x] 已完成事项
+```
+
+## 许可证
+
+本项目基于 [MIT 许可证](https://github.com/any-tdf/stdf/blob/main/LICENSE)。请随意享受并贡献给这个开源项目。

+ 29 - 0
packages/rollup-plugin-md-ts/eslint.config.js

@@ -0,0 +1,29 @@
+import prettier from 'eslint-config-prettier';
+import js from '@eslint/js';
+import globals from 'globals';
+import ts from 'typescript-eslint';
+
+export default ts.config(
+	js.configs.recommended,
+	...ts.configs.recommended,
+	prettier,
+	{
+		languageOptions: {
+			globals: {
+				...globals.browser,
+				...globals.node
+			}
+		}
+	},
+	{
+		files: ['**/*.ts'],
+		languageOptions: {
+			parserOptions: {
+				parser: ts.parser
+			}
+		}
+	},
+	{
+		ignores: ['build/', 'dist/']
+	}
+);

+ 56 - 0
packages/rollup-plugin-md-ts/package.json

@@ -0,0 +1,56 @@
+{
+	"name": "rollup-plugin-md-ts",
+	"version": "0.0.0",
+	"description": "a rollup plugin for markdown files",
+	"type": "module",
+	"exports": {
+		".": {
+			"default": "./dist/index.js",
+			"types": "./dist/index.d.ts"
+		}
+	},
+	"scripts": {
+		"pretest": "npm run build",
+		"build": "rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript",
+		"prebuild": "rm -rf dist/*"
+	},
+	"keywords": [
+		"rollup",
+		"plugin",
+		"md",
+		"markdown",
+		"typescript"
+	],
+	"author": "any-tdf",
+	"funding": "https://stdf.design?fund",
+	"license": "MIT",
+	"homepage": "https://github.com/any-tdf/stdf/blob/main/packages/rollup-plugin-md-ts/README.md",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/any-tdf/stdf"
+	},
+	"bugs": {
+		"url": "https://github.com/any-tdf/stdf/issues?q=is:issue+is:open+md"
+	},
+	"dependencies": {
+		"marked": "^15.0.3",
+		"rollup": "^4.28.1",
+		"rollup-pluginutils": "^2.8.2"
+	},
+	"devDependencies": {
+		"@eslint/js": "^9.16.0",
+		"@rollup/plugin-node-resolve": "^15.3.0",
+		"@rollup/plugin-typescript": "^12.1.1",
+		"assert": "^2.1.0",
+		"eslint": "^9.16.0",
+		"eslint-config-prettier": "^9.1.0",
+		"fs": "^0.0.1-security",
+		"globals": "^15.13.0",
+		"mocha": "^11.0.1",
+		"rollup-plugin-uglify": "^6.0.4",
+		"source-map-support": "^0.5.21",
+		"tslib": "^2.8.1",
+		"typescript": "^5.7.2",
+		"typescript-eslint": "^8.18.0"
+	}
+}

+ 30 - 0
packages/rollup-plugin-md-ts/rollup.config.ts

@@ -0,0 +1,30 @@
+import json from '@rollup/plugin-json';
+import typescript from '@rollup/plugin-typescript';
+import { uglify } from 'rollup-plugin-uglify';
+import { readFileSync } from 'fs';
+const pkg = JSON.parse(readFileSync('./package.json', 'utf8'));
+const external = Object.keys(pkg.dependencies);
+
+export default {
+	input: 'src/index.ts',
+	output: [
+		{
+			dir: 'dist',
+			format: 'es',
+			file: pkg['main'],
+			sourcemap: true,
+			compact: true
+		}
+	],
+	external: external,
+	plugins: [
+		typescript({
+			declaration: true,
+			declarationDir: 'dist',
+			rootDir: 'src',
+			tsconfig: './tsconfig.json'
+		}),
+		json(),
+		uglify()
+	]
+};

+ 42 - 0
packages/rollup-plugin-md-ts/src/index.ts

@@ -0,0 +1,42 @@
+import { marked, MarkedOptions } from 'marked';
+import { createFilter } from 'rollup-pluginutils';
+
+const ext = /\.md$/;
+
+export type MDOptions = {
+	include?: string[];
+	exclude?: string[];
+	marked?: MarkedOptions;
+};
+
+export default function md(options: MDOptions = {}) {
+	const filter = createFilter(options.include || ['**/*.md'], options.exclude);
+	if (options.marked) {
+		marked.setOptions(options.marked);
+	}
+	return {
+		name: 'md',
+		// transform 是 rollup 插件必需的方法
+		// 用于转换源文件内容
+		transform(md: string, id: string) {
+			// 检查文件是否是 .md 文件
+			if (!ext.test(id)) return null;
+			// 检查文件是否匹配 include/exclude 配置
+			if (!filter(id)) return null;
+
+			// 使用 marked 解析 markdown,如果没有配置 marked 则返回原始内容
+			const data = options.marked ? marked.parse(md, options.marked) : md;
+			return {
+				// 导出解析后的内容为默认导出
+				code: `export default ${JSON.stringify(data.toString())};`,
+				// sourcemap 相关
+				map: {
+					version: 3,
+					sources: [id],
+					names: [],
+					mappings: ''
+				}
+			};
+		}
+	};
+}

+ 14 - 0
packages/rollup-plugin-md-ts/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES2018",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "declaration": true,
+    "outDir": "./dist",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist"]
+}