如何使用 Bash 将多个文件的一部分合并为一个文件

Question

我有以下结构。每个目录都有同名但内容不同的文件。

lib- 
    |-filled
            |-A1K_plus.svelte
            |-A1K.svelte
            |- // more files
    |-outlined
            |-A1K_plus.svelte
            |-A1K.svelte
            |- // more files
    |-round
            |-A1K_plus.svelte
            |-A1K.svelte
            |- // more files
    |-sharp 
            |-A1K_plus.svelte
            |-A1K.svelte
            |- // more files

例如filled/A1K_plus.svelte有以下内容：

<script>
    export let size = '24';
    export let color = 'currentColor';
    export let ariaLabel = '1k_plus';
</script>

<svg
    xmlns="http://www.w3.org/2000/svg"
    width={size}
    height={size}
    fill={color}
    class={$$props.class}
    {...$$restProps}
    aria-label={ariaLabel}
    viewBox="0 0 24 24"
    ><path
        d="M19 // removed for brevity"
    /></svg
>

并outlined/A1K_plus.svelte有以下内容。

<script>
    export let size = '24';
    export let color = 'currentColor';
    export let ariaLabel = '1k_plus';
</script>

<svg
    xmlns="http://www.w3.org/2000/svg"
    width={size}
    height={size}
    fill={color}
    class={$$props.class}
    {...$$restProps}
    aria-label={ariaLabel}
    viewBox="0 0 24 24"
    ><path
        d="M19 3H5c-1.1 // removed for brevity"
    /><path
        d="M7.5 15H9V9H // removed for brevity"
    /></svg
>

等等。有些具有path第一个标签，有些则在标签path之间有两个标签。svg

现在我想合并所有文件，为每个文件创建以下内容。

<script lang="ts">
    export let size = '24';
    export let color = 'currentColor';
    export let ariaLabel = '1k_plus';
    export let variation = 'filled';
    let svgpath: string;
    switch (variation) {
        case 'filled':
            svgpath =
                '<path d="M10 10.5h1 // path from filled/A1K.svelte"/>';
            break;
        case 'outlined':
            svgpath =
                '<path d="M19 3H5c-1.1 // path from outlined/A1K.svelte " />';
            break;
        case 'round':
            svgpath =
                '<path  d="M19 3H5c-1.1 // path from round/A1K.svelte"/>';
            break;
        case 'sharp':
            svgpath =
                '<path d="M21 3H3v18h18V3zM9 // path from sharp/A1K.svelte"/>';
            break;
        case 'two-tone':
            svgpath =
                '<path  d="M5 19h14v-6.// path from two-tone/A1K.svelte"/>';
            break;
        default:
            svgpath =
                '<path d="M10 10.5 // same path as filled"/>';
    }
</script>

<svg
    xmlns="http://www.w3.org/2000/svg"
    width={size}
    height={size}
    fill={color}
    class={$$props.class}
    {...$$restProps}
    aria-label={ariaLabel}
    viewBox="0 0 24 24"
>
    {@html svgpath}
</svg>

我可以用 Bash 来做这个吗？

Answer 1

你可以用 bash 来做到这一点。但是您需要一个 xml 解析器，这是不可能用 shell 工具实现的。 XML 也不是常规语言，因此经典的正则表达式工具（如 see、grep、perl/pcre）也没有用。

这里有很多帖子在 shell 脚本中使用 XML 解析器命令行工具！至少这允许您提取所需标签的内容并拼凑出一个新的有效 svg。

不管怎样，对于你的打字稿加入，你会想要更多。

老实说，使用您熟悉的更通用的脚本语言，而不是在 bash 中尝试。在 shell 中执行此操作没有任何好处，因为 shell 从来不打算解析除其自身语法之外的代码。

Python 3 基本上可以在每台 Unix/Linux 机器上使用，它带有一个 XML 解析器，并且能够处理模板化字符串，例如您的“if”所需的字符串。我想 ts 也可以 - 但我从未使用过 typescript，所以我无法对此做出合格的声明。