☰

sed를 사용하여 URL의 16진수 코드를 바꾸고 모든 SVG 파일의 SVG 태그 뒤에 새 SVG 코드를 삽입합니다.

tag-icon • tag-icon text-processing sed regular-expression svg
sed를 사용하여 URL의 16진수 코드를 바꾸고 모든 SVG 파일의 SVG 태그 뒤에 새 SVG 코드를 삽입합니다.

제 생각에는...

  • 모든 SVG 파일에서 URL(id)의 16진수 코드를 교체합니다.
  • 정규식을 사용하여 뒤에 새 SVG 코드 줄을 삽입/추가합니다 <svg ...>.

입력하다:

<svg xmlns="http://www.w3.org/2000/svg" style="isolation:isolate" width="16" height="16" viewBox="0 0 16 16">
 <defs>
  <clipPath id="clip1">
   <rect width="16" height="16"/>
  </clipPath>
 </defs>
 <g clip-path="url(#clip1)">
  <rect fill="#5c616c" width="4.625" height="3.594" x="18.19" y="-.16" transform="matrix(1,0,0,1,0,0)"/>
  <path fill="#5c616c" d="M 11.538 1 L 11.166 1.46 L 9.895 3.082 L 8.712 3.082 L 8.712 3.783 L 5.908 3.783 L 5.908 5.185 L 8.712 5.185 L 8.712 5.886 L 9.895 5.886 L 11.166 7.507 L 11.538 7.967 L 12.042 7.704 L 15 6.149 L 14.342 4.922 L 11.911 6.193 L 10.596 4.484 L 11.91 2.774 L 14.343 4.046 L 15 2.819 L 12.042 1.263 L 11.538 1 Z M 3.103 2.38 C 1.911 2.38 1 3.292 1 4.484 C 1 5.376 1.512 6.121 2.271 6.433 L 3.935 11.495 L 6.894 11.495 L 4.943 5.514 C 5.11 5.209 5.207 4.864 5.207 4.484 C 5.207 3.292 4.295 2.38 3.103 2.38 Z M 3.103 3.783 C 3.525 3.783 3.804 4.062 3.804 4.484 C 3.804 4.906 3.525 5.185 3.103 5.185 C 2.681 5.185 2.402 4.906 2.402 4.484 C 2.402 4.062 2.681 3.783 3.103 3.783 Z M 2.402 12.196 C 1.63 12.196 1 12.825 1 13.598 L 1 15 L 12.918 15 L 12.918 13.598 C 12.918 12.825 12.289 12.196 11.516 12.196 L 2.402 12.196 Z"/>
 </g>
</svg>

산출:

<svg xmlns="http://www.w3.org/2000/svg" style="isolation:isolate" width="16" height="16" viewBox="0 0 16 16">

<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
  <stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1" />
  <stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1" />
</linearGradient>

 <defs>
  <clipPath id="clip1">
   <rect width="16" height="16"/>
  </clipPath>
 </defs>
 <g clip-path="url(#clip1)">
  <rect fill="url(#grad1)" width="4.625" height="3.594" x="18.19" y="-.16" transform="matrix(1,0,0,1,0,0)"/>
  <path fill="url(#grad1)" d="M 11.538 1 L 11.166 1.46 L 9.895 3.082 L 8.712 3.082 L 8.712 3.783 L 5.908 3.783 L 5.908 5.185 L 8.712 5.185 L 8.712 5.886 L 9.895 5.886 L 11.166 7.507 L 11.538 7.967 L 12.042 7.704 L 15 6.149 L 14.342 4.922 L 11.911 6.193 L 10.596 4.484 L 11.91 2.774 L 14.343 4.046 L 15 2.819 L 12.042 1.263 L 11.538 1 Z M 3.103 2.38 C 1.911 2.38 1 3.292 1 4.484 C 1 5.376 1.512 6.121 2.271 6.433 L 3.935 11.495 L 6.894 11.495 L 4.943 5.514 C 5.11 5.209 5.207 4.864 5.207 4.484 C 5.207 3.292 4.295 2.38 3.103 2.38 Z M 3.103 3.783 C 3.525 3.783 3.804 4.062 3.804 4.484 C 3.804 4.906 3.525 5.185 3.103 5.185 C 2.681 5.185 2.402 4.906 2.402 4.484 C 2.402 4.062 2.681 3.783 3.103 3.783 Z M 2.402 12.196 C 1.63 12.196 1 12.825 1 13.598 L 1 15 L 12.918 15 L 12.918 13.598 C 12.918 12.825 12.289 12.196 11.516 12.196 L 2.402 12.196 Z"/>
 </g>
</svg>

이것은 내 쉘 스크립트입니다.

for i in *.svg; 
    do sed --in-place --follow-symlinks 's/#5c616c/url(#grad1)/' "$i"
done;

for i in *.svg; 
    do sed --in-place --follow-symlinks '/(svg)([^<]*|[^>]*)/ag <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" style="stop-color: rgb(255, 255, 0); stop-opacity: 1"\/> <stop offset="100%" style="stop-color: rgb(255, 0, 0); stop-opacity: 1"\/> <\/linearGradient>' "$i"
done;

한 줄:

for i in *.svg; do sed --in-place --follow-symlinks 's/#5c616c/url(#grad1)/g; /(svg)([^<]*|[^>]*)/a <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" style="stop-color: rgb(255, 255, 0); stop-opacity: 1"\/> <stop offset="100%" style="stop-color: rgb(255, 0, 0); stop-opacity: 1"\/> <\/linearGradient>' "$i"; done

내 명령은 일부 SVG 파일을 대체 및 삽입하고 다른 파일을 손상시키기 때문에 잘못되었습니다.

기반:

고쳐 쓰다

기반:

Breeze라는 아이콘 테마가 있습니다. 먼저 /usr/share/icons/breeze, /home/$USER/.icons/breeze또는 에 위치한 아이콘 테마를 찾고 싶은데 /home/$USER/.local/share/icons/breeze, 발견되면 cd교체하여 여러 폴더(모든 폴더가 아님)의 모든 SVG 파일에 삽입하겠습니다. 세 개의 폴더: apps/16, mimetypes/16및 places/16.

파일의 연결에서 파생된 이러한 코드를 다시 적용할 수 있습니까 replace-all.sh?

답변1

내가 올바르게 이해했다면 다음 두 가지 작업을 수행하고 싶습니다.

  1. #5c616c로 대체됩니다 url(#grad1).

  2. 여는 태그 <svg ...>뒤에 다음 줄을 삽입합니다 .

    <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
  <stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1" />
  <stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1" />
</linearGradient>

개인적으로 저는 Perl에서 모든 작업을 수행하겠습니다.

#!/bin/perl
my $replacement=<<EoF;
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
  <stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1" />
  <stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1" />
</linearGradient>
EoF
## This is just to fix SE's syntax highlighting /    
my $foundSvg = 0;
while (<>) {
  ## Insert the replacement after the 1st line matching '<svg'
  if (/<\s*svg/) {
    $foundSvg++;
  }
  if ($foundSvg == 1) {
    ## $_ is the value of the current line. If we have found the <svg,
    ## append $replacement to this line
    $_ .= $replacement;
    ## Increment $foundSvg so we don't do this twice
    $foundSvg++;
  }
  ## For all lines, replace all occurrences of #5c616c with url(#grad1)
  s/#5c616c/url(#grad1)/g;
  ## Print the line
  print;
}

다음 과 같이 저장하세요 foo.pl.

for f in *svg; do
   perl foo.pl "$f" > tmpFile && mv tmpFile "$f"
done

관련 정보