@ dhiwise/ 组件- tagger

自动注释JSX组件和带有数据属性的HTML元素.

安装

npm install @dhiwise/component-tagger

使用量

维特

// vite.config.js
import { defineConfig } from 'vite';
import componentTagger from '@dhiwise/component-tagger';

export default defineConfig({
  plugins: [
    componentTagger({
      verbose: true,
      attributePrefix: 'data-component',
    }),
  ],
});

下一个.js

// next.config.js
const componentTagger = require('@dhiwise/component-tagger/nextLoader');

module.exports = {
  webpack: (config) => {
    config.module.rules.push({
      test: /\.(js|jsx|ts|tsx)$/,
      use: [
        {
          loader: componentTagger,
          options: {
            verbose: true,
          },
        },
      ],
    });
    return config;
  },
};

HTML (CLI) (英语)

npx @dhiwise/component-tagger-html --output-dir public

特征

• 自动标记带有数据属性的 JSX 组件
• 支持 Vite, Webpack, Next.js 和 HTML 选项
• 可配置属性前缀和内容提取

许可证

麻省理工学院